学习- vue 中 API $attr 用法

2.4.0新增

定义：包含了父作用域不作为 prop 被识别（且获取）的 attribute 绑定（ class 和 style 除外）。当一个组件没有声明任何 prop 时，这里会包含所有父作用域的绑定（除class 和 style 除外），并且可以通过 v-bind="$attrs" 传入内部组件--在创建高级别的组件时非常有用。

父组件的列表行数据传递给孙子组件展示

父组件：

<template>

  <div>

    Parent: {{ msg }}

    <Child :msg="msg" />

  </div>

</template>

<script>

import Child from './child.vue'

export default {

  name: 'Parent',

  components: { Child },

  data () {

    return {

      msg: 'hello world!'

    }

  }

}

</script>

亲儿子组件:

<div>

child:{{ }}

</div>

</template>

import Grandson from './grandson.vue'

export default {

name: 'Child',

components: {

Grandson

}

</script>

亲孙子组件:

<div>Grandson:{{ msg }}</div>

</template>

export default {

name: 'Grandson',

props: {

msg: {

type: String,

default: ''

}

</script>

效果展示：

转载：https://www.jb51.net/article/246436.htm#_lab2_1_1

巴特西

学习- vue 中 API $attr 用法

最新文章

热门文章