Bus
1新建组件store.vue,在路由列表注册,并在components目录下新建一个组件AInput.vue(自己 创建的组件最好带上前缀)
{
path:’/store’,
component:()=>import(’@/views/store.vue’)
}
components的AInput.vue
<input @input=“handleInput” :value=“value”>//绑定input事件和value值
store.vue
//使用input组件
//v-model双向绑定(相当于语法糖,相当于 :value=“inputValue” @input=“handleInput”)
{ { inputValue }}//显示inputValue
实现过程input标签绑定handleInput事件,当input值修改时会触发input里的事件,从而执行handleInput方法,值的显示是通过value
兄弟之间通信
新建components组件 Ashow.vue
{ { content }}
在store.vue引Ashow.vue注册组件
import Ashow from ‘_c/Ashow.vue’
//跨文件之间如何通信:使用bus
定义文件夹bus,并创建index.js文件
import Vue from ‘vue’//引入Vue
const Bus = new Vue()//创建实例
export default Bus//导出
然后在main.js把bus引入 import Bus