vant-element-vue项目笔记（杂）

一、组件传值

爷孙

通过传两层props，中间不需要赋值

子父传多个值

// 父
<compontent @update:name='callback(arguments)' />
// 子
$emit('update:name',1,2,3,4)

兄弟---eventBus

//js
import Vue from 'vue'
const bus = new Vue()
export default bus

// 传
Bus.$emit("update:name","hiinew")
// 接收
Bus.$on("update:name",(callback)=>{ console.log(callback)})

二、element-table

v-show不能控制element的table-colume组件的显示隐藏

三、v-for

v-for出来的数据不能在同一元素上使用（子组件上的v-for除外），因为使用时和v-for同时进行会导致初始化还未完成就投入使用导致页面渲染不完整--------------------v-for之后必须必须要绑key

四、forEach

forEach数组API遍历数组的每一项,对每一项执行给定的函数（改变原数组），如果数组长度为0，则不执行

五、弹出框

window.comfirm弹出框只有确定，取消按钮，适用于操作提示

六、 css预处理深入组件选择器

提示：syle上需加上scoped

css      >>>
less    /deep/
scss   ::v-deep

七、回调

callback，回调函数是作为参数传递给另一个函数，并在其父函数之后执行的函数

八、css

文字换行

wehite-space:normal
word-break:break-all

设置旋转中心

transform-origin:50% 50%

超过部分显示...(省略号)

white-space:nowrap
text-overflow:ellipsis;
overflow:hidden;

注意：此css只适用于中文

九、JQ的AJAX

.get 获取数据，done在get获取成功后执行

十、生成随机数

Math.floor(Math.random()*100+1)
// 生成1~100随机数

十一、多选删除

在多选删除时不能通过index删，因为在遍历删除多选数组时，元素所在的位置是变化的，而index没变导致删除错乱

十二、vant坑

vant的计数器组件使用事件修饰符，如：.stop，.prevent等，不生效，聪明的我想了个办法，在组件外面套一个div通过阻止div的事件流来阻止组件的事件流