【Vue学习笔记】三、vue组件与生命周期

【Vue学习笔记】三、vue组件与生命周期

      • 三、vue组件与生命周期
        • 1)vue组件
        • 2)组件之间的父子关系
        • 3)使用组件的三个步骤
        • 4)注册全局组件
        • 5)组件的props
          • 1.创建props自定义属性
          • 2.结合v-bind使用自定义属性
          • 3.props是只读的
          • 4.转接props值
          • 5.props的默认值
          • 6.props的type属性
          • 7.props的required必填项
        • 6)组件之间的样式冲突问题
          • 1.冲突的原因
          • 2.冲突的解决方法
          • 3.使用`deep`修改子组件中的样式
        • 7)vue组件的实例对象
        • 8)生命周期
          • 1.生命周期&生命周期函数
          • 2.组件生命周期函数的分类
          • 3.beforeCreate和created的特点
          • 4.beforeMount和mounted
          • 5.beforeUpdate和updated
          • 6.beforeDestroy和destroyed
        • 9)组件之间的数据共享
          • 1.组件之间的关系
          • 2.父组件向子组件传递数据
          • 3.子组件向父组件传递数据
          • 4.兄弟组件之间的数据共享
        • 10)ref引用
          • 1.ref操作DOM
          • 2.ref操作组件
          • 3.this.$nextTick

三、vue组件与生命周期

1)vue组件

vue中规定:组件的后缀名是.vueApp.vue本质上就是一个组件

每个.vue组件都由3部分组成:

  • template -> 组件的模板结构
  • script -> 组件的JavaScript行为
  • style -> 组件的样式

注意

methods、watch、computed等写法与之前一致

 
2)组件之间的父子关系

你可能感兴趣的:(前端,vue.js)