Vue.js props 부모 구성 요소의 값 수정

제목: 두 가지 방법이 있는데 첫 번째는 데이터 템플릿을 사용하여 변수 던전을 만들고 이 던전 변수를 유지하는 것이다.
코드 예:

		 data ， 
		 ： count， initCount, count
	
	

					
	
	
	
		Vue.component('my-component',{
			props:['initCount'],
			template:'<div>{{count}}</div>',
			data:function(){
				return {
					count:this.initCount
				}
			}
		});
		var app = new Vue({
			el:"#app"
		});

	

두 번째는 계산 속성을 사용하는 것이다.

					
	
	
	
		Vue.component('my-component',{
			props:['width'],
			template:'<div :style="style"> </div>',
			computed:{
				style:function(){
					width:this.width+'px'
				}
			}
		});
		var app = new Vue({
			el:"#app"
		});

	

구성 요소를 다른 사람에게 사용해야 할 때 데이터 검증을 추천합니다.다음은 몇 가지 실례이다

	
		Vue.component('my-component',{
			props:{
					// 
					propA:number,
					// 
					propB:[String,Number],
					// , ， true
					propC:{
						type:Number,
						default:true
					},
					// ， 
					propD:{
						type:Number,
						required:true
					},
					// ， 
					propE:{
						type:Array,
						default:function(){
							return [];
						}
					},
					// 
					propE:{
						validator:function(){
							return value>10;
						}
					}
				}
			}
		});