Vue--props
Posted 彭蒙善
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Vue--props相关的知识，希望对你有一定的参考价值。
组件实例的作用域是孤立的。这意味着不能 (也不应该) 在子组件的模板内直接引用父组件的数据。要让子组件使用父组件的数据，我们需要通过子组件的 props 选项。
字面量语法 vs 动态语法
初学者常犯的一个错误是使用字面量语法传递数值：
因为它是一个字面 prop，它的值是字符串 "1" 而不是 number。如果想传递一个实际的 number，需要使用 v-bind，从而让它的值被当作 javascript 表达式计算：
App.vue （父组件）
<template> <div> <h1>我是app组件</h1> <zujian :color="111"></zujian> </div> </template> <script> import zujian from ‘./components/zujian.vue‘ export default{ data(){ return{ a:1 } }, components:{ zujian } } </script>
Zujian.vue(子组件)
<template> <div> <h1>我是zujian组件 {{typeof color}}---{{color}}</h1> </div> </template> <script> export default{ props:["color"], // 父亲传 谁用谁接受（儿子接受） data(){ return{ } } } </script>
更多请访问：https://cn.vuejs.org/v2/guide/components.html#Prop
以上是关于Vue--props的主要内容，如果未能解决你的问题，请参考以下文章