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

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

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

前言

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

先看效果

用法

NewsList.js

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

說明

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

總結(jié)

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

參考

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

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

相關(guān)文章

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

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

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

    React引入antd-mobile+postcss搭建移動端

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

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

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

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

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

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

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

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

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

    深入研究React中setState源碼

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

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

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

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

    本文主要介紹了React翻頁器的實現(xiàn),文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    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

最新評論