? ? ? ListView 在移動(dòng)開(kāi)發(fā)中是個(gè)很常用對(duì)的控件股缸，不管是andorid 還是ios衡楞，在顯示長(zhǎng)列表視圖時(shí)，都是個(gè)不錯(cuò)的選擇（ps：andorid有更好的新控件）敦姻，那么在react native中也是如此瘾境，本文是從項(xiàng)目中摘出來(lái)的，是配合mobx來(lái)實(shí)現(xiàn)的镰惦，當(dāng)然也可以用redux實(shí)現(xiàn)迷守，不過(guò)個(gè)人覺(jué)得redux過(guò)于繁雜，不如mobx來(lái)的舒服旺入，看有人說(shuō)就用React的SetState 也可以兑凿，但是render 太頻繁，重繪太多茵瘾，太消耗性能礼华，并且邏輯也很亂。下面先上一個(gè)效果圖龄捡，
? ? ? ?使用mobx卓嫂，首先要知道他的幾個(gè)核心概念，observer聘殖，observable,action,computed晨雳。這里不做過(guò)多介紹行瑞，大家可以自行百度去查找相關(guān)資料。下面說(shuō)一下代碼餐禁，
? ? ? 從上面可以看出血久。定義了2個(gè)被觀察者，items帮非，代表數(shù)據(jù)源氧吐，selectedItem ?代表當(dāng)前被選中的item,這里只是模擬下數(shù)據(jù)，在構(gòu)造方法中末盔，實(shí)際項(xiàng)目肯定是從服務(wù)器拉下來(lái)的筑舅。
? ??
?上面是一個(gè)item的model類(lèi)，定義一個(gè)action陨舱，也就是點(diǎn)擊item后調(diào)用的方法翠拣，判斷當(dāng)前點(diǎn)擊的item ?是否已經(jīng)被選中，來(lái)更改點(diǎn)擊后的狀態(tài)游盲，
定義的computed的 判斷每一個(gè)item的狀態(tài)误墓，是否被選中。
前面的都是定義了被觀察者益缎，現(xiàn)在這個(gè)是定義觀察者谜慌，可以看出，onPress 回調(diào)調(diào)用了Item中的select方法莺奔，布局里面根據(jù)this.props.data.selected顯示不同的圖片（不選中是灰色的）欣范，mobx的好處是，實(shí)現(xiàn)了數(shù)據(jù)和界面的綁定弊仪，只要觀察者感興趣的被觀察者發(fā)送了變化熙卡，他就會(huì)自動(dòng)的發(fā)送變化，而且mobx為這種變化 提供了盡可能的優(yōu)化励饵，性能開(kāi)銷(xiāo)小驳癌，最后貼出顯示界面的代碼
? ? ?
為了演示的方便? 用的scrollView 代替了listview? 但是原理是一樣的，componentWillReact ?是mobx ?提供的新的組件生命周期方法役听，在界面重新render后會(huì)調(diào)用颓鲜，
