Element UI 报错 _self.$scopedSlots.default is not a function

最新推荐文章于 2022-09-21 11:05:32 发布
最新推荐文章于 2022-09-21 11:05:32 发布
阅读量159 收藏
点赞数
分类专栏： Element UI 文章标签： Element UI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41679047/article/details/89365354
版权

在vue项目中使用element ui 框架的 table控件 根据v-if条件判断控制台报错和table列出现错乱

代码
<el-table-column v-if="!investorFlag" align="center" prop="loanNumber" label="借款次数" min-width="60"/>
控制台报错

在这里插入图片描述

原因

表格是element-ui通过循环产生的，而vue在dom重新渲染时有一个性能优化机制，就是相同dom会被复用

解决

查看的vue文档v-if

只要在判断的元素上添加一个唯一的key属性,（确保key的值是唯一的）

<el-table-column v-if="!investorFlag" align="center" prop="loanNumber" label="借款次数" min-width="60" key='loanNumber'/>
ᴄᴀᴘ
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
出现 Property or method “xx“ is not defined on the instance but referenced during render 解决方法（全面分析）
码农研究僧的博客
03-14 1011
出现 Property or method "xx" is not defined on the instance but referenced during render 解决方法（全面分析）
[Vue warn]: Error in render: "TypeError: _self.$scopedSlots.default is not a function"
cap
01-28 1319
在vue项目中使用element ui 框架的 table控件 根据v-if条件判断控制台报错和table列出现错乱 代码 &lt;el-table-column v-if="!investorFlag" align="center" prop="loanNumber" label="借款次数" min-width="60"/&gt; 控制台报错 原因 表格是element-ui通过
[Vue warn]: Error in render: "TypeError: _self.$scopedSlots.default is not a function" 错误解决
ying940718的博客
08-02 1597
出现【[Vue warn]: Error in render: “TypeError: _self.$scopedSlots.default is not a function”】这个错误是因为element-ui的table组件使用了v-if去做动态切换展示。 解决方法：把v-if换成v-show（只是隐藏不注销）去实现上面的动态切换效果就可以了。 ...
[Vue warn]: Error in render: “TypeError: renderEmpty is not a function“
东扯葫芦西扯瓜——前端小菜鸟的博客
08-21 2113
[Vue warn]: Error in render: "TypeError: renderEmptthis.configProvider.renderEmpty;而且有意思的是，全量引入ant-design-vue，是没有这个问题的，启用按需涌入ant-design-vue的Select组件，就会报这个错误。首先我们点开报错的index.js。那获取大家就已经恍然大悟了，ant-desgign-vue需要引入语言包。从项目里面点进ant-design-vue 的lib里面，找到打包后的select文件。
vue文件在html中直接引用 import 传过来的方法报错Error in render: “TypeError: _vm.XXXX is not a function“
Jet_Lover的博客
09-21 4934
在写组件时直接在html中使用 import过来的方法XXXX报错。所以方法跟变量一样最好再赋值、声明一次后使用。这样写直接报错，因为。
TypeError: _self.$scopedSlots.default is not a function解决方法
weixin_44132327的博客
07-28 1611
使用Element-ui的el-table组件遇到的一个问题 在用v-if动态显示某个列的时候,正常操作是 没什么问题的 但是如果在这基础上使用<template slot-scope="scope"操作的话,来回切换重复渲染的话,是会报错的: TypeError: _self.$scopedSlots.default is not a function 遇到这个问题有两个解决办法: 1.给el-table加上key属性,不同的el-table加上不同的key属性 2.如果是 el-table-co
Element UI Kit_v2.0.sketch
02-10
Axcure好用的元件库工具，Axcure好用的元件库工具，Axcure好用的元件库工具，Axcure好用的元件库工具Axcure好用的元件库工具Axcure好用的元件库工具Axcure好用的元件库工具Axcure好用的元件库工具Axcure好用的元件库...
官方下载Element_Components_v2.1.0.rplib设计原件
07-25
Element Plus的axure资源 适用于Axure 9及以上版本 官方下载地址https://raw.githubusercontent.com/ElementUI/Resources/master/Element_Components_v2.1.0.rplib 由于网络，大家下载不是很方便，此处提供资源
element-ui_rplib.zip
07-26
element-ui_rplib.zip
Element_UI_2.4_API.rar
08-24
element-ui离线文档，从官网下载，官方有外链js因此页面加载可能会有问题，此版本下载了所有到外链js，完全离线访问，版本2.4，方便离线开发，打开浏览器就能访问，和官网效果一样。
Wondershare_PDFelement_Professional_7.0.0.4256_Downloadly.ir.rar
08-08
Wondershare_PDFelement_Professional_7.0.0.4256_Downloadly.ir.rar
Vue进阶（幺贰陆）：表格复用 TypeError: _self.$scopedSlots.default is not a function解决方法
IT全栈 华强工作室
06-12 2728
前言 在使用 element ui 的el-table 组件时，表头应用v-if判断来动态显示，正常来说这样的操作是没有问题的，但是如果在这基础上使用 <template slot-scope="scope"> 操作的话，表头一旦切换就会报错，错误信息如下： _self.$scopedSlots.default is not a function 解决方法 在v-for或者v-if切换标签时，多个相同的标签被渲染，如果不添加key来区分则会出现复用的情况。而原本这些标签每一个都是独立的，故需要
VUE：解决 [Vue warn]: Error in render: “TypeError: item.slice is not a function“ （取部分数据）
热门推荐
愿我如星君如月 ... 夜夜流光相皎洁 ...
02-20 5万+
1. 双重循环中使用 slice方法，报错： [Vue warn]: Error in render: "TypeError: item.slice is not a function" 2. 原代码写法如下，紫框中的代码可以正常运行，但红框中的代码报错 3. 原因：slice 方法是作用于数组的方法。 bodyInfoList 是一个数组结构，但 item 是对象结构，故报...
Error in render: "TypeError: _self.$scopedSlots.default is not a function"
Zxiuping的博客
11-15 2855
今天在做项目中遇到了如上图这样一个问题，项目是Vue+element-ui。原因是table中用了多个v-if，解决方案有两个： 1、用v-show代替v-if（个人推荐用第二种）； 2、在v-if条件语句中加key作为区分就不会报错了。 &lt;el-table :data="WarehousingDetails.productSkuVOList" :header-cell-...
[Vue warn]: Error in render: “TypeError: data.reduce is not a function“报错详解
weixin_44370837的博客
10-29 4926
大家好，我是小梅，公众号：「小梅的前端之路」 原创作者。 作为在前端领域不断探索的一员，在此记录开发中遇到的问题，如果你也遇到了相同的问题，希望本文对你有帮助。 一、问题定位： 打开开发者工具，点开错误的那个小三角，便能看到详细信息，定位到错误发生在哪个文件的哪一行。 我的项目使用Element-UI组件进行开发，clDetailList是用于给el-table的data属性赋值的。clDetailList按照预期得是Array类型的，问题就出在push函数执行完之后返回的是数组的长度.
vue.runtime.esm.js:1737 TypeError: _self.$scopedSlots.default is not a function
@必意玲
06-13 3828
报错 _self.$scopedSlots.default is not a function , 原因：element组件在一个vue组件中重复使用 解决方案：此时的解决办法是设置 key 如下：一个vue组件中使用了多个 el-table 导致报错，给每个添加不一样的 key 值即可。确保每一个el-table具有唯一性 <el-checkbox v-model="isStorNo" c...
vue 报错：_self.$scopedSlots.default is not a function
日常笔记/总结/系列知识梳理
07-13 9058
问题描述：使用表格时做了v-if判断；首次渲染没有问题；反复操作便会报错； 解决：在网上查了一下解决方法主要有两个（1）用v-show替代v-if;(2)给每个加个key属性 相关文章：https://segmentfault.com/q/1010000012526240...
获取列表时控制台报错：_self.$scopedSlots.default is not a function
张张张的博客
06-18 900
原因： 当来回切换页面时候，控制台报上面的错误。列表是使用表格el-table-column时做了v-if判断，首次渲染没有问题，但是反复操作就会报错了。是因为表格是element-ui通过循环产生的，而vue在dom重新渲染时有一个性能优化机制，就是dom会被重复使用。 解决方法： 给每一个key后边加上一个key，用key管理可复用的元素即可。注意每个v-if后边的key的值是不一致的。 ...
vue Element UI使用中.$scopedSlots.default is not a function 报错
Kuroko's Development Notes
09-29 8813
情景描述: 在使用 element ui 的el-table 组件时，表头进行v-if判断来动态显示，正常来说这样的操作时没得任何毛病的，但是如果在这基础上使用 &lt;template slot-scope="scope"&gt; 操作的话，表头一旦切换就会报错，错误信息如下图：   解决办法如图： 解释一下： 这是因为在v-for或者v-if切换标签时，多个相同的标签被渲染，...
TypeError: _this.$refs.dataSelect.focus is not a function
最新发布
07-11
如果你在使用 `this.$refs.dataSelect.focus()` 时遇到了 "TypeError: _this.$refs.dataSelect.focus is not a function" 错误，这可能是因为 `uni-data-select` 组件没有提供 `focus` 方法。 在这种情况下，你可以...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值