首页 > 代码库 > Vue--props
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
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。