this.$slots是vue里面的一个只读的api，用来访问被插槽分发的内容。每个具名插槽有其相应的 property (例如：v-slot:foo 中的内容将会在 vm.$slots.foo 中被找到)。default property 包括了所有没有被包含在具名插槽中的节点，或 v-slot:default 的内容。

这个api在日常用的不多，今天一个项目里控制列的展示中看到了这个api，然后惊奇的发现，在子组件的created里面打印this.$slots是一个空对象（请以JSON.parse(JSON.stringify())这种方式转换，因为对象后面会被赋值），在mounted里面打印才可以拿到。

这是因为在created阶段只是定义好了实例以及一些data，methods等基础属性，this.$slots这种属性只是进行了初始化定义，并没有真正赋值。而this.$slots其实会去寻找DOM元素对应的插槽，只有在mounted的阶段，DOM才被挂载成功。

# vue.js # javascript
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue