捕获 Vue 组件的错误信息的方法
errorCaptured 是组件内部钩子,当捕获一个来自子孙组件的错误时被调用,接收 error、vm、info 三个参数,return false 后可以阻止错误继续向上抛出。
errorHandler 为全局钩子,使用 Vue.config.errorHandler 配置,接收参数与 errorCaptured 一致,2.6 后可捕捉 v-on 与 promise 链的错误,可用于统一错误处理与错误兜底
Vue 组件里的定时器销毁的方法
如果页面上有很多定时器,可以在 data 选项中创建一个对象 timer,给每个定时器取个名字一一映射在对象 timer 中, 在 beforeDestroy 构造函数中:
for(let k in this.timer){clearInterval(k)};
如果页面只有单个定时器,可以这么做。
const timer = setInterval(() =>{}, 500);
this.$once('hook:beforeDestroy', () => {
clearInterval(timer);
})
Vue.cli 中使用自定义的组件的方法
- 第一步: 在 components 目录新建你的组件文件(indexPage.Vue),script一定要 export default {}
- 第二部: 在需要用的页面(组件)中导入:import indexPage from'@/components/indexPage.Vue'
- 第三步: 注 入 到 Vue 的子组件的 components 属性上面,components:{indexPage}
- 第四部: 在 template 视图 view 中使用,例如有 indexPage 命名,使用的时候则 index-page
Vue 中 solt 的使用方式,以及 solt 作用域插槽的用法
- 使用方式:当组件当做标签进行使用的时候,用 slot 可以用来接受组件标签包裹的内容,当给 solt 标签添加 name 属性的 时候,可以调换响应的位置
- 插槽作用域: 作用域插槽其实就是带数据的插槽,父组件接收来自子组件的 slot 标签上通过 v-bind 绑定进而传递过来的数 据,父组件通过 scope 来进行接受子组件传递过来的数据