vue3.0 新特性

setup函数:

  在该函数声明的变量以及值需要return,其他模块才能只用,否则只能在该函数内使用。

声明变量:

  vue3.0声明变量提供了两种方式,一个是ref(响应式),一个是reactive(非响应式),

  以ref声明的变量都有一个value属性, 我们在setup函数改变量.value属性来进行赋值才能达到响应式,在html模块不需要.value该属性来获取值。

获取子组件:

  2.0写法:this.refs['xxx'];

  3.0写法:

    1.需要在引入VUE里面的全局变量,ref->import {ref} from 'vue'

    2.在setup函数声明一个ref构造函数的变量名(变量名和渲染标签的ref属性一致)最后 return;

关于子组件里面对父组件进行交互:

  获取父组件属性:

    2.0写法:this.parent.parent.....;

    3.0写法:子组件根据setup函数里面默认参数props,context,利用第二个参数可以获取父级,context.parent.xxx;

  调用父组件方法

    2.0写法:this.emit('xxx',xxx);

    3.0写法:

      1.子组件需要声明父组件传过来的函数emits:['xxxx',....],这个写法类似于传值

      2.子组件在setup函数的第二个参数来获取vue的emit('xxx',xxx);

钩子函数:

  onCreated

  onMounted

  ...

监听:

  vue3.0一个监听一个函数,如果需要监听多个值则需要写多个监听函数;

 

上一篇:洛谷P1948 [USACO08JAN]电话线Telephone Lines


下一篇:vue3.x新特性之setup函数,看完就会用了