Vue学习props传递数据

vue数据传递props。

使用选项props来声明需要从父级接受的数据。props的值可以是两种，一种是字符串数组，一种是对象。

props声明的数据与组件data函数return的数据主要区别就是props的来自父级，而data中式组件自己的数据，作用域是组件本身，这两种数据都可以在模板template及计算属性computed和方法methods中使用。

如下，数据msg就是通过props父级传递过来的。

<div id="app">
		<my-component msg="来自父组件的数据"></my-component>
	</div>
	<script type="text/javascript" src="./js/vue.js"></script>
	<script type="text/javascript">
		Vue.component('my-component',{
			props:['msg'],
			template:'<div>{
  {msg}}</div>'
			
		});
		var app = new Vue({
			el:"#app"
			
		});
	</script>

这种方式只能是传递字符。如果想传递数组，可以使用v-bind来转换。

比如如下：

<div id="app">
		<my-component msg="[1,2,3]"></my-c