WeX5数据绑定:selectedOptions绑定

优质
小牛编辑
134浏览
2023-12-01

selectedOptions绑定用在select元素中,用来绑定已选中的对象,通常被用在多选列表中。如果列表为单选列表(下拉列表),选中值可以用value绑定。

示例代码

//.W片段
<p>
 Choose some countries you'd like to visit:
 <select bind-options="availableCountries" bind-selectedOptions="chosenCountries" size="5" multiple="true"> 
 </select>
 <button component="$UI/system/components/justep/button/button" class="btn btn-warning" bind-click="buttonClick">点我切换</button>
</p> 


//.js片段
var Model = function(){
 this.callParent();
 this.availableCountries=justep.Bind.observableArray(['France', 'Germany', 'Spain']);
 this.chosenCountries=justep.Bind.observableArray(['Germany']);
 };
 Model.prototype.buttonClick = function(event){
 this.chosenCountries.push('France');
 };

绑定规则:

selectedOptions绑定只能用在select元素中,并且常用在多选列表中。当select的option对应的value在selectedOptions中存在的时候,该option将会被选中。关于该绑定能不能和value绑定同时使用还有待测试。