组件模块部分(插槽,单页面,通信)

44 阅读2分钟

(1)在父组件的子组件标签上自定义一个事件,然后调用需要的方法 ​ (2)在子组件的方法中通过 this.$emit("事件")来触发在父组件中定义的事件,数据是以参数的形式进行传递的

兄弟组件如何通信

(1)找到min.js文件,给他vue挂载一个 公共的 busVue.prototype.bus Vue.prototype.bus = new Vue() ​ (2)传送数据的一方 用this.bus.bus.emit('事件名','传送的数据') ​ (3)在 接收数据的一方用通过 Bus.$on("事件名",(data)=>{data是接受的数据})

12种组件通信 vue12种通信方式 prop 验证,和默认值 props:会接收不同的数据类型,常用的数据类型的设置默认值的写法,Number, String, Boolean, Array, Function, Object

所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定:父级prop 的更新流动到子组件中,但是反过来则不行。这样防止子组件意外改变父级组件的状态,从而导致你的应用的数据流向难以理解。若果在子组件中直接修改prop传递的值,Vue会发出警告,

方法二:通过 vuex 实现 (要了解)

具体实现:vuex 是一个状态管理工具,主要解决大中型复杂项目的数据共享问题,主要包括 state,actions,mutations,getters 和 modules 5 个要素,主要流程:组件通过 dispatch 到 actions,actions 是异步操作,再 actions中通过 commit 到 mutations,mutations 再通过逻辑操作改变 state,从而同步到组件,更新其数据状态

组件中写 name 选项有什么作用 ① 项目使用 keep-alive 时,可搭配组件的 name 进行缓存过滤。 ② DOM 做递归组件时需要调用自身 name ③ vue-devtools 调试工具里显示的组件名称是由 vue 中组件 name 决定的

自定义组件 在vue 中的 component 中新建组件,定义好