Vue中props用法介绍

​前言:

在Vue中通过props,可以将原本孤立的组件串联起来,也就是可以子组件可以接收父组件传递过来的data,比如子组件想要引用父组件的数据,那么在props里面声明一个变量,这个变量就可以引用父元素的数据。

实例演示:

子组件:





父组件:





运行上面的程序可以看到,当我们通过点击父组件的按钮切换某个值时,子组件接收的值也会相应变化。

Vue中props用法介绍_第1张图片

子组件接收父组件的数据有两种接收方式:

  • 方式1:简单接收, 只需要给出所要接收的变量的名字即可
  • 方式2: 具体接收,给每个接收的变量选择性地指明数据类型,是否可为空,默认值

到此这篇关于 Vue中props用法介绍的文章就介绍到这了,更多相关 Vue中props用法内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

你可能感兴趣的