文章/答案/技术大牛

发布

社区首页 >问答首页 >类型“”{}“”上不存在属性“”joiner“”

问类型“”{}“”上不存在属性“”joiner“”
EN

Stack Overflow用户

提问于 2021-10-20 12:21:03

回答 1查看 26关注 0票数 0

尝试设置状态是tsx，但是当我尝试从json打开数据时，我得到了这个错误。

Property 'joiner' does not exist on type '{}'. TS2339

下面是组件(删除了无用的代码)

import Player from '../components/Player'

import listingData from '../libs/listingData'

const Battle = () => {
    const [loading, setLoading] = useState(false);
    const [creatorState, setCreator] = useState({ health: 100, animate: false, recieve: false });
    const [opponentState, setOpponent] = useState({ health: 100, animate: false, recieve: false });
    const [data, setData] = useState({});

    const loadBattle = () => {
        setLoading(true);
        const id = parseInt((window.location.pathname).replace("/battle/", ""));
        setData(listingData[id])

        setLoading(false);
        setTimeout(() => triggerAttack("creator"), 5000);
    }

    useEffect(() => {
        loadBattle();
    }, [])

    return (
        <Root>
            <Player 
                weakness={loading ? '' : data.joiner.weakness} //Error triggered here
                image=""
                status="filled"
                price={2352.54}
                health={`${creatorState.health}%`}
                creator={false}
                recieve={creatorState.recieve}
                animate={creatorState.animate}
                loading={loading}
            />
        </Root>
    )
}

export default Battle

播放器组件属性都设置为any

json中的对象示例

        price: 5251.52,
        status: 'filled',
        creator: {
            weakness: 'wind',
            address: '',
            image: '',
        },
        joiner: {
            weakness: 'water',
            address: '',
            image: '',
        },
    },

我对typescript非常陌生，所以我不熟悉类型，它说我没有足够的细节，所以这就是我写的。

reactjs

json

typescript

tsx

回答 1

Stack Overflow用户

发布于 2021-10-20 12:28:37

在这种情况下，您必须使用包含预期数据结构的接口键入状态。像这样：

示例：

interface IUser {
  name: string;
}
const [user, setUser] = useState<IUser>({name: 'Jon'});

或

interface Provider {
  connected: boolean;
  type: string;
}
const [wearablesList, setWearablesList] = useState<Provider[]>([]);

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/69645898

复制

相似问题

问类型“”{}“”上不存在属性“”joiner“”
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问类型“”{}“”上不存在属性“”joiner“”EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问类型“”{}“”上不存在属性“”joiner“”
EN