flex binding

一般的,只要在属性前加上
  [Bindable] 或
  [Bindable(event="eventname")]
  元标记即可
   注意:
  如果没有标出触发绑定的事件,正如[Bindable],Flex会自动为绑定加上 propertyChange事件,当源数据发生变化时,Flex将自动派发该事件,触发数据绑定。如果修改后数据和源数据“===”也就是全等,那么Flex将不会触发数据绑定。
  如果标出的触发绑定的事件,正如[Bindable(event="eventname")],那么在源数据发生改变的时候,必须dispatch出该事件才能触发数据绑定。不论修改后数据和源数据是否全等,Flex都将会触发数据绑定,需要自己编程控制,例如
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<s:layout>
		<s:BasicLayout/>
	</s:layout>
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
		[Bindable(event="shijianevent")]
		private var str:String="null";
		
		private function doTest():void
		{
			str = textIput1.text;
			if(str!="null") //判断和源数据是否相等,不相等则触发绑定
			this.dispatchEvent(new Event("shijianevent"));
		}
		]]>    
	</fx:Script>
	<mx:Text text="{str}" x="80" y="10"/>
	
	<s:Button click="doTest()" x="187" y="67" label="Binding"/>
	<s:TextInput x="305" y="4" id="textIput1"/>
	<s:Label x="187" y="10" text="输入要绑定的数据:" height="22"/>
</s:Application>
   如果没有this.dispatchEvent(new Event("shijianevent"))这句,那么你点击按钮是没有设么作用的。 另外当申明自定义触发事件时,用ChangeWatcher来监控其变化,发现虽然目的源值变了,但是ChangeWatcher却监控不到变化,同样ChangeWatcher也监控不到非共有变量的变化

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
代码纠错<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="js/vue.js"></script> </head> <body> <div id="app"> <button @click="reset">还原</button> <div v-noData="{goodsList}"> <ul> <li><span>商品名称</span></li> <li v-for="(good,index) in goodsList" :key="index"> <span>{{good.name}}</span> <span>{{good.price|filterPrice}}</span> <span @click="delood(index)" style="color: red;" cursor:pointer>删除</span> </li> </ul> </div> </div> <script> const goodMixin={ date(){ return{ goodsList:[ {name:'电饭煲',price:200.1333232'}, {name:'电视机',price:2880.998395'}, {name:'电冰箱',price:650.2034'}, {name:'电脑',price:4032.9930'}, {name:'电磁炉',price:210.4322'}, ] } }, filters:{ filterPrice(value){ let newVualue =[] newVualue=value.toLocaleString().split('.') newVualue[0] = (newVualue[0]+'').replace(/\d{1,3}(?=(\d{3}+$)/g,'$&,') return newVualue[0] + '.' + newVualue[1].slice(0,2); } } new Vue({ el:'app', mixins:[goodsMixin], directives:{ inserted(el,binding){ const noData = document.createElement('dvi'); noDta.classList = 'noData' noData0innerHTML = '暂无数据'; el.appendChid(noData) const {goodsLIst} = binding.value; noData.style.display = goodsList.length ===0?'block':'none' }, update(le,binding){ const {goodsList} = binding.value; el.querSeletor('.noData').style.display = goodsList.lenght ===0? 'block':'none'; } } }, data(){ return{} } }) </script> <style> #app ul li{ list-style: none; display: flex; width: 400px; justify-content: space-between; } .noData{ width: 400px; text-align: center; margin-left: 40px; } </style> </body> </html>
06-06

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值