React-Client-Session TypeError: undefined is not an object (evaluating '_reactClientSession.default.setStoreType')

Question

我正在尝试在 React Native 应用程序中使用 react-client-session :https://github.com/grizzthedj/react-session。我几乎是在照搬这个例子：

import ReactSession from 'react-client-session';

  <Button
                style = {styles.button}
                title="Submit"
                        onPress={() => {
                          ReactSession.setStoreType("localStorage");
                          ReactSession.set("playerName", selectedValue);
                             /* 1. Navigate to the Character Skill Sheet route with params */
                             navigation.navigate('SkillSheet', {
                              playerName: selectedValue
                            });
                        }}
                color="#19AC52"
            />

预期的结果是我按下按钮并导航到 SkillSheet 视图，它将设置会话变量 playerName = selectedValue。

但是当我点击按钮时出现这个错误：TypeError: undefined is not an object (evaluating '_reactClientSession.default.setStoreType')

react-client-session 还在使用吗？如果是这样，我做错了什么？这是另一个 link：https://www.npmjs.com/package/react-client-session

这是我要在其中执行此操作的完整文件：

CharacterSelectScreen.js

import React, {useState} from 'react'
import { StyleSheet, Text, View, TouchableOpacity, TextInput, Button, Picker, ScrollView} from 'react-native'
import { NavigationContainer, useNavigation, useRoute } from '@react-navigation/native';
import { userFetch } from '../../sharedComponents/userFetch.js';
import { styles } from './styles.js';
import ReactSession from 'react-client-session';

const CharacterSelectScreen = ({navigation, route}) => {
  const [characterList, setCharacterList] = useState([]);
  const [selectedValue, setSelectedValue] = useState("Choose..");

  //Using React.useEffect to simulate React's #componentDidMount
       React.useEffect(()=>{
        console.log('Select Screen loaded.')
        //Must use an async function to call the userFetch function then set the result equal to characterList
        const asyncFunc = async () => {
          const charList = await userFetch();
          setCharacterList(charList);
        }
        //Call the async function
        asyncFunc();
      },[])

    return (
        <View style={styles.container}>
            <Text style={{marginLeft: 130}} h1>Select a character:</Text>
            <Picker
              style={styles.charPicker}
              mode="dropdown"
              selectedValue={selectedValue}
              onValueChange={(itemValue, itemIndex) => setSelectedValue(itemValue)}
              >
              {characterList.map((item, index) => {
                  return (<Picker.Item label={item} value={item} key={index}/>) 
              })}
          </Picker>
          <Button
                style = {styles.button}
                title="Submit"
                        onPress={() => {
                          ReactSession.setStoreType("localStorage");
                          ReactSession.set("playerName", selectedValue);
                             /* 1. Navigate to the Character Skill Sheet route with params */
                             navigation.navigate('SkillSheet', {
                              playerName: selectedValue
                            });
                        }}
                color="#19AC52"
            />
      </View>
    )
}

export default CharacterSelectScreen;

这是我的 yarn.lock:

react-client-session@^0.0.7:
  version "0.0.7"
  resolved "https://registry.yarnpkg.com/react-client-session/-/react-client-session-0.0.7.tgz#b1bdee73d2dd29a0cd2ed220c91bd86671787dec"
  integrity sha512-UeiECmKybfqTp/Fk7qCOs0OV/Lnw3km5vNoYnVjygVDwqg8SPm8YzFKJcFsmNDhPh6Ak1oCjAySJfSDrSZglbQ==

Answer 1

文档似乎有误或已过时。

包 exports 像这样的单个命名导出：

export {
  ReactSession
};

所以应该这样导入（区别在花括号里）：

import { ReactSession } from 'react-client-session';

P.S.

您可以详细了解两种不同类型的导出 here。