![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 65
boss-qiu
这个作者很懒,什么都没留下…
展开
-
vue组件/实例的选项的顺序
常用属性的顺序export default { name:'component', // 组件名 components:{}, // 子组件 directives:{}, // 自定义指令 filters:{}, // 过滤器 mixins:{}, // 混入 model:{}, // 定义v-model props:{}, // 父组件传递的prop data() { return {} // 本地状态 }, computed:{}, // 计算属性原创 2021-11-05 12:21:09 · 907 阅读 · 0 评论 -
vue基础组件的自动化全局注册
可能你的许多组件只是包裹了一个输入框或按钮之类的元素,是相对通用的。我们有时候会把它们称为基础组件,它们会在各个组件中被频繁的用到。所以会导致很多组件里都会有一个包含基础组件的长列表:import BaseButton from './BaseButton.vue'import BaseIcon from './BaseIcon.vue'import BaseInput from './BaseInput.vue'export default { components: { Base原创 2021-08-20 14:42:10 · 237 阅读 · 0 评论 -
vue中v-model实现原理,几种实现思路
通过props接收value,作为input的property(dom属性),另外绑定input事件,通知父组件更新数据// input.vue<template> <input type="text" :value.prop="value" @input="notify" /></template><script>export default { props: { value: String },// 必须用 "value" 这个prop原创 2021-07-30 11:36:08 · 1261 阅读 · 0 评论 -
vue的provide和inject使用方法及原理
provide / inject应用场景父子组件通讯:替代this.$parent祖孙组件通讯: 祖先组件不需要知道哪些后代组件在使用他提供的数据;后代组件也不需要知道注入的数据来自哪里使用方法// 父级组件提供 'foo'var Provider = { provide: { foo: 'bar' }, // ...}// 子组件注入 'foo'var Child = { inject: ['foo'], created () { console原创 2021-07-19 13:19:53 · 901 阅读 · 0 评论 -
控制台打印vue实例
前言:Vue项目运行后会把各个组件的数据挂载到对应的dom上根组件(#app)上获取实例首先app.vue会挂载到 id 为 “app” 的 div 上边打印这个divconsole.dir(document.querySelector('#app'))查看控制台,发现存在一个键:"__vue__"其实app.vue对应的实例就是这个__vue__对象打印这个对象console.dir(document.querySelector('#app'..原创 2021-04-07 11:38:36 · 8522 阅读 · 1 评论