一个react native 0.70组件在FlatList中显示items。数组items是一个状态，在钩子useEffect中赋值。我想用jest（0.29）来看看一个项目的名称是否显示在屏幕上，所以需要模拟状态items。下面是FlatList的渲染项目代码：

return (
      <TouchableOpacity testID={'listselltrade.detail'} onPress={() => {item.sell ? navigation.navigate("Deal Detail", {item:item}) : navigation.navigate("Trade Detail", item={item})} } >. <<== here is the testID
      <View style={{flex:1, flexDirection:"row", alignItems:"center", width:wp("100%"), height:wp("17%")}}>
        
          <View style={{width:wp("17%"), padding:wp("0.1%")}}>
          {sourceUri && sourceAltUri ? <CachedImage source={{uri:sourceUri}} sourceAlt={{uri:sourceAltUri}} style={styles.itemImage} /> : null}
          </View>
          <View style={{width:wp("25%")}}>
            <Text style={{fontSize:wp("4.2%"), flexWrap:"wrap"}}>{item.artwork.item_name}</Text> 
          </View>
          <View style={{width:wp("8%")}}>
            <Text style={{fontSize:wp("4.2%"), flexWrap:"wrap"}}>{helper.returnStatus(item.status)}</Text> 
          </View>
          <View style={{width:wp("7%")}}>
            <Text style={{fontSize:wp("4.2%"), flexWrap:"wrap"}}>{item.price+item.shipping_cost}</Text>
          </View>
          <View style={{width:wp("3%"),flexDirection:"row"}}>
            {item.sell ? <Icon name='logo-usd' size={_size}  /> : <Icon name='sync' size={_size} />}
          </View>
          <View style={{width:wp("8%")}}>
            <Text style={{fontSize:wp("4.2%"), flexWrap:"wrap"}}>
                    {item.artwork.category.category_name}
            </Text>
          </View> 
          
          {item.sell && _me.id !== data.uploader_id && <View style={{width:wp("15%")}}>
            <TouchableOpacity onPress={() => {navigation.push('ListBuyExg', {uploader_id:item.artwork.uploader_id, title:_sellerposter_name})} }>
                <Text style={{fontSize:wp("4.2%"), flexWrap:"wrap"}}>
                    {_sellerposter_name}
                </Text>
              </TouchableOpacity>
          </View> }
          {!item.sell && _me.id !== data.uploader_id && <View style={{width:wp("15%")}}>
            <TouchableOpacity onPress={() => {navigation.push('ListBuyExg', {uploader_id:item.artwork.uploader_id, title:_sellerposter_name})} } >
                <Text style={{fontSize:wp("4.2%"), flexWrap:"wrap"}}>
                    {_sellerposter_name}
                </Text>
              </TouchableOpacity>
          </View> } 
          
          <View style={{width:wp("20%")}}>
            <Text style={{fontSize:wp("3%"), flexWrap:"wrap"}}>{item.active_date.substring(0,10)}</Text>
          </View>
      </View>
      </TouchableOpacity>
    );

下面是一段代码：

test ('has screen detail', async () => {

        
        const route = {params: {title:"my title", uploader_id:8}}; //8 is a test user. all is listed
        const navigation = {navigate:jest.fn()};
        const propsVal = {device_id:"a device id"};
        const authVal = {result:"fdkfjdsl;fjdsafkl", myself:{id:1,name:"me"}};
        const stateVal = {name:"me", alias:"akkus", aka:"aka"};
        const items = [{artwork:{item_name:"work name"}}];  //<<==mock state items
        const component = (
            <NavigationContainer>
                <propsContext.Provider value={propsVal}>
                    <authContext.Provider value={authVal}>
                        <stateContext.Provider value={stateVal}>
                            <ListSellTrade route={route} navigation={navigation}/>
                        </stateContext.Provider>
                    </authContext.Provider>
                </propsContext.Provider>              
           </NavigationContainer>);

        const wrapper = render(component);

        expect(screen.getByText('my title')).toBeTruthy(); //<<==pass
        expect(screen.getByText('work name')).toBeTruthy();  //<<==failed

        expect(screen.getByTestId('listselltrade.detail')).toBeTruthy();  //<<==failed

    })

但是没有item呈现在屏幕上，并且2个预期失败。模拟状态items以便可以将其馈送到jest中进行进一步测试的正确方法是什么？