时间戳

首页 > 解决方案 > 如何通过 Context native 传递数组

reactjs - 如何通过 Context native 传递数组

问题描述

嗨，亲爱的，感谢您回答我的问题，我正在尝试使用下面的 react-native 上下文将数组从一个组件传递到另一个组件，但它不适用于数组

import React from 'react';


var context = {
    playlist: null, //like I want to make this value a array
    setPlaylist: (songID: string) => {

    }
}

export var playlistContext = React.createContext(context);

我的 App.tsx 文件

const [playlist, setPlaylist] = useState<string | null>(null);

<playlistContext.Provider value={{
    playlist,
    setPlaylist: (songID: string) => setPlaylist(songID),
}}>
    <Navigation colorScheme={colorScheme} />
    <StatusBar />
    <PlayerWidget />
</playlistContext.Provider>

标签： reactjsreact-nativereact-reduxreact-hooksreact-context

解决方案

这是通过改革 playlistContext.tsx 上下文 API 得到的答案，如下所示：

import React from 'react';


var context = {
    playlist: [],
    setPlaylist: (songID: string[]) => {

    }

}

export var playlistContext = React.createContext(context);

然后我在我的 App.tsx 中执行此操作，因此必须在提供程序中使用它

const [playlist, setPlaylist] = useState<string | string[]>([]);
 <playlistContext.Provider value={{
                    playlist,
                    setPlaylist: (songID: string[]) => setPlaylist(songID),

                  }}>

                    <Navigation colorScheme={colorScheme} />
                    <StatusBar />
                    <PlayerWidget />
                  </playlistContext.Provider>

推荐阅读