vue2面试题

vue2的组件通讯方式：vue中8种组件通信方式, 值得收藏! (opens new window)

vue2也给出了刷新页面数据不丢失的组件—数据持久化储存。
通讯还可参考其他2篇文章：
- https://juejin.cn/post/6884393371591245838#heading-3 (opens new window)
- https://juejin.cn/post/6844903845642911752 (opens new window)【这个不错】
在掘金小册《Vue.js 组件精讲 (opens new window)》中（UI 组件库 — iView 的作者）也通过$children/$parent遍历的方式去获取组件，就可以解决所有组件通讯问题。书籍和笔记在这里：https://gitee.com/wangluoshihuang/vue-zuJianJingJiang

对于在组件上使用 v-model (opens new window)理解：v-model的原理这里在input元素和组件上分别都讲明了。

参考上面官网的链接，会得到以下代码：

    <custom-input  // 当用在组件上时，v-model 则会这样：
		v-bind:value="searchText"
		v-on:input="searchText = $event"  // 这里的$event等于下面的$event.target.value。
    ></custom-input>
    // 在其 input 事件被触发时，将新的值通过自定义的 input 事件抛出
	Vue.component('custom-input', {  // 组件的具体实现
		props: ['value'],
  		template: `
  			<input
    			v-bind:value="value"
    			v-on:input="$emit('input', $event.target.value)" // '在其 input 事件被触发时，将新的值通过自定义的 input 事件抛出'---这句话解释为---具体元素上通过$emit触发的事件的参数[这里是$event.target.value]会变为组件上监听这个事件的$event。子组件里触发$emit并有参数时，当前组件上v-model绑定的:value属性的值才会被更新。
			>
		`
  })