vue定义组件是什么,vue定义组件规范

我们在使用vue自定义组件时，常常会遇到切换组件的操作，但是切换组件的时候，如果没有处理好，组件内容就不会刷新。如：标签页下放自定义组件，切换标签时，组件里面的内容不刷新，导致页面停留在上一次的操作。那么我们应该如何来解决这个问题呢？接下来说说我在网上看到的两种方法

一、通过v-if来刷新

当我们在mmydmt组件请求后台接口完成后要刷新子孙组件时，我们就可以在mmydmt组件调用以下函数,实现子孙组件的刷新（感觉这种方法怪怪的，个人喜欢第二种方法）
上代码：

//父组件内容<child v-if="show"></child>js: refresh（）{ this.show = false; this.$nextTick(() => { this.show = true; });}

补充：使用v-if来有条件的渲染组件，还可以避免父组件异步传值失败的问题。比如我们要在父组件请求后台数据，并且要将数据在子组件渲染，这时就可以用v-if，有数据时才渲染子组件，就不会出错了。

二、通过key来刷新

key 属性不是给开发人员用的，而是用来 给vue 元素渲染的时候用的，每次渲染的时候会去拿这个key 值做对比，如果这一次的key 值和上一次的key值是不一样的才会重新渲染dom 元素，否则保持上一次的元素状态。
根据这个原理我们可以给key 直接绑定一个 时间戳

代码

父组件<button @click="handleLoad">点击重新加载子级</button><children :key="timer"></children> methods: { handleLoad () { this.timer = new Date().getTime() } }

每次点击的时候都会重新加载子组件 ，created() 生命周期函数每次都会执行，重新生成dom 元素。也省的用watch 去监听了！

总结：以上两种方法都能实现，应该还有其他的方式，知道的小伙伴可在下方评论哦。
另外：本文纯属个人笔记，如有说错的地方，希望大家积极纠正