1# Props 2 3 4自定义组件可以通过props声明属性，父组件通过设置属性向子组件传递参数。通过父组件向下传递参数的示例如下： 5 6## 添加默认值 7 8子组件可以通过固定值default设置默认值，当父组件没有设置该属性时，将使用其默认值。此情况下props属性必须为对象形式，不能用数组形式，示例如下： 9 10 11 12```html 13<!-- comp.hml --> 14<div class="container"> 15 <div class="row-1"> 16 <div class="box-1"> 17 <text>xiaoziti</text> 18 </div> 19 <div class="box-2"> 20 <text>{{text}}</text> 21 </div> 22 <div class="box-3"> 23 <text>{{textdata[0]}}</text> 24 </div> 25 </div> 26 <div class="row-2" if="true"> 27 <button value="{{progress}}"></button> 28 </div> 29 <div class="row-3" if="true"> 30 <button onclick="buttonClicked" value="click"></button> 31 </div> 32</div> 33``` 34 35 36 37```json 38{ 39 "data": { 40 "progress": { 41 "default": "80" 42 } 43 }, 44 "props": { 45 "textdata": { 46 "default": ["a","b"] 47 }, 48 "progress": { 49 "default": 60 50 }, 51 "text": { 52 "default": "ha" 53 } 54 }, 55 "actions": { 56 "buttonClicked": { 57 "action": "proxy", 58 "method": "event_1" 59 } 60 } 61} 62``` 63 64 65 66```html 67<!-- xxx.hml --> 68<element name='comp' src='../../common/customComponent/customComponent.hml'></element> 69 70<div class="container"> 71 <comp progress="{{clicknow}}" textdata="{{texts}}" if="false" @event_1="click"></comp> 72</div> 73``` 74 75 76## 数据单向性 77 78父子组件之间数据的传递是单向的，只能从父组件传递给子组件，子组件不能直接修改父组件传递下来的值，可以将props传入的值用data接收后作为默认值，再对data的值进行修改。 79