我收到控制台警告“可能未处理的承诺拒绝 TypeError:0,_jwtDecode.default 不是函数(未定义)”

问题描述 投票:0回答:1

我已经正确安装并导入了jwtDecode,但为什么这里有任何错误是代码:- 我的 jwtDecode 似乎不起作用,我不知道原因,我尝试了一些我在反应本机中新的东西,所以请帮忙,为什么它不起作用

import { StyleSheet, Text, View } from 'react-native';
import { useContext, useLayoutEffect, useEffect, useState } from 'react';
import { useNavigation } from '@react-navigation/native';
import { Ionicons } from '@expo/vector-icons';
import { MaterialIcons } from '@expo/vector-icons';
import { UserType } from '../userContext';
import AsyncStorage from '@react-native-async-storage/async-storage';
import jwtDecode from 'jwt-decode';
import axios from 'axios';
import Users from '../Components/Users';

const Chat_feature = () => {
  const navigation = useNavigation();
  const { userId, setUserId } = useContext(UserType);
  const [users, setUsers] = useState([]);

  useLayoutEffect(() => {
    navigation.setOptions({
      headerTitle: '',
      headerLeft: () => (
        <Text style={{ fontSize: 16, fontWeight: 'bold', paddingLeft: 4 }}>FRIENDS</Text>
      ),
      headerRight: () => (
        <View style={{ flexDirection: 'row', alignItems: 'center', gap: 8, paddingRight: 4 }}>
          <Ionicons name="chatbox-ellipses-outline" size={24} color="black" />
          <MaterialIcons name="people-outline" size={24} color="black" />
        </View>
      ),
    });
  }, []);

  useEffect(() => {
    console.log('reached first');
    const fetchUsers = async () => {
      const token = await AsyncStorage.getItem('authToken');
      
      console.log('Token:', token);
      console.log('reached second');

      const decodedToken = jwtDecode(token);

      console.log('reached third');

      const userId = decodedToken.userId;
      setUserId(userId);
      console.log('reached here');
      console.log('Fetching users...');
      axios.get(`http://localhost:8000/users/${userId}`).then((response) => {
        setUsers(response.data);
      }).catch((error) => {
        console.log('Error while retrieving users', error);
      });
    };

    fetchUsers();
  }, [setUserId]);

  console.log('users=', users);

  return (
    <View>
      <View>
        {users.map((item, index) => (
          <Users key={index} item={item} />
        ))}
      </View>
      <Text>Chat</Text>
    </View>
  );
};

export default Chat_feature;

const styles = StyleSheet.create({});

我尝试以不同的方式导入 jwtDecode,例如 import * as jwtDecode、import {decode as jwtDecode} ....我期望我的 jwtDecode 能够运行,但它没有运行,这就是为什么“达到第三个未打印”

javascript react-native jwt token decode
1个回答
0
投票

我使用 atob 而不是 jwtDecode,这对我有用..这是实现

import { decode as base64decode } from 'base-64';

//组件内部 global.atob = base64decode;

const decodedToken = JSON.parse(atob(token.split('.')[1]));
© www.soinside.com 2019 - 2024. All rights reserved.