欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

react-native中ListView組件點(diǎn)擊跳轉(zhuǎn)的方法示例

 更新時(shí)間：2017年09月30日 09:57:35   作者：Tomoya  
ListView作為React Native的核心組件,用于高效地顯示一個(gè)可以垂直滾動(dòng)的變化的數(shù)據(jù)列表。下面這篇文章主要給大家介紹了關(guān)于react-native中ListView組件點(diǎn)擊跳轉(zhuǎn)的相關(guān)資料，需要的朋友可以參考借鑒，下面來(lái)一起看看吧。

前言

在 上一篇 我們實(shí)現(xiàn)了NavigatorIOS與ListView結(jié)合使用的方法，那么這篇文章介紹一下ListView里點(diǎn)擊跳轉(zhuǎn)到新視圖的方法，話不多說(shuō)了，來(lái)一起看看詳細(xì)的介紹吧。

先看效果

用法

NewsList.js

_onPress(rowData) {
 this.props.navigator.push({
 title: rowData,
 component: CNodeJSList,
 passProps: {
 name: rowData,
 }
 })
}

說(shuō)明

  • 使用 this.props.navigator.push() 指定component 就可以跳轉(zhuǎn)到下一個(gè)視圖里了，如果想傳值，可以用 passProps 屬性，在下一個(gè)視圖里使用 this.props.name 接收就可以了
  • 對(duì)于onPress里方法的調(diào)用，如果是以onPress={this._onPress}調(diào)用 _onPress方法，頁(yè)面是不跳轉(zhuǎn)的，需要綁定this，寫法是：onPress={this._onPress.bind(this)} 但這樣好像沒法傳值，所以要傳值需要這樣寫：onPress={()=>{this._onPress(rowData)}} ，這樣就沒問(wèn)題了，頁(yè)面也可以跳轉(zhuǎn)成功了

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，如果有疑問(wèn)大家可以留言交流，謝謝大家對(duì)腳本之家的支持。

參考

ListView列表點(diǎn)擊跳轉(zhuǎn)

源碼：https://github.com/tomoya92/ITNews-React-Native

相關(guān)文章

  • React 組件轉(zhuǎn) Vue 組件的命令寫法

    React 組件轉(zhuǎn) Vue 組件的命令寫法

    本文先介紹兩個(gè)框架的組件共性和不兼容的地方，再介紹react-to-vue的使用和原理,需要的朋友可以參考下
    2018-02-02
  • React引入antd-mobile+postcss搭建移動(dòng)端

    React引入antd-mobile+postcss搭建移動(dòng)端

    本文給大家分享React引入antd-mobile+postcss搭建移動(dòng)端的詳細(xì)流程，文末給大家分享我的一些經(jīng)驗(yàn)記錄使用antd-mobile時(shí)發(fā)現(xiàn)我之前配置的postcss失效了，防止大家踩坑，特此把解決方案分享到腳本之家平臺(tái)，需要的朋友參考下吧
    2021-06-06
  • React如何使用axios請(qǐng)求數(shù)據(jù)并把數(shù)據(jù)渲染到組件

    React如何使用axios請(qǐng)求數(shù)據(jù)并把數(shù)據(jù)渲染到組件

    這篇文章主要介紹了React如何使用axios請(qǐng)求數(shù)據(jù)并把數(shù)據(jù)渲染到組件，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
    2022-08-08
  • 深入理解React調(diào)度(Scheduler)原理

    深入理解React調(diào)度(Scheduler)原理

    本文主要介紹了深入理解React調(diào)度(Scheduler)原理，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2022-07-07
  • react如何向數(shù)組中追加值

    react如何向數(shù)組中追加值

    這篇文章主要介紹了react如何向數(shù)組中追加值，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
    2022-09-09
  • 在react中對(duì)less實(shí)現(xiàn)scoped配置方式

    在react中對(duì)less實(shí)現(xiàn)scoped配置方式

    這篇文章主要介紹了在react中對(duì)less實(shí)現(xiàn)scoped配置方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2023-11-11
  • 深入研究React中setState源碼

    深入研究React中setState源碼

    這篇文章主要介紹了深入研究React中setState源碼，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2017-11-11
  • react-dnd?API拖拽工具詳細(xì)用法示例

    react-dnd?API拖拽工具詳細(xì)用法示例

    這篇文章主要為大家介紹了react-dnd?API拖拽工具的詳細(xì)用法示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
    2022-10-10
  • React翻頁(yè)器的實(shí)現(xiàn)(包含前后端)

    React翻頁(yè)器的實(shí)現(xiàn)(包含前后端)

    本文主要介紹了React翻頁(yè)器的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2021-08-08
  • react框架next.js學(xué)習(xí)之API?路由篇詳解

    react框架next.js學(xué)習(xí)之API?路由篇詳解

    這篇文章主要為大家介紹了react框架next.js學(xué)習(xí)之API?路由篇詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
    2022-09-09

最新評(píng)論