简体   繁体   中英

React-native unidentified is not an object

When I dispatch my delete action to Redux I am getting the error unidentified is not an object evaluating selectedUser.imageUri Everything is being loaded from a server and I know the delete action works as it deletes the object from the server however I get this error and the screen only updates when I reload the application. Please can someone help me I really need your help. Thank you so much in advance!!!I am even checking to see if there is no object in the selecetedUser array then render an image called nothing.png

This is my code where I am seeing the error

const Viewer = (props) => {
    const userID = props.navigation.getParam('id')
    //Nothing is just a picture when there are no images
    import nothing from './Images/nothing.png'

    const selectedUser = useSelector(state => state.user.user.find(user => user.id === userID))
    const cBimageUri = {uri: selectedUser.imageUri }
    const checkImage = cBimageUri.length === 0? nothing : cBimageUri
    const cBimageUri = {uri: selectedUser.imageUri }

    const deleteCb = useCallback(() =>{
        dispatch(deleteUser(userID))
        props.navigation.goBack()
    },[userID])

    useEffect(() => { 
        props.navigation.setParams({deleteCb: deleteCb})
    },[deleteCb])

    return (
        <ScrollView style={{backgroundColor: 'white'}}>
            <Image source={checkImage} style={styles.image}/>
            <Text style={styles.name}>{selectedCookBook.name}</Text>
        </ScrollView>
    )
}

export default Viewer

Redux reducer

import { CREATE_USER, DELETE_USER } from '../actions/account'

const initialState = {
    account: [],
}

const USerReducer = (state=initialState, action) =>{
    switch(action.type){

        case CREATE_USER:
            const newUser = new MyUser(
                action.userData.id,
                action.userData.name,
                action.userData.image, 
            )
            
            return { ...state, user: state.account.concat(newUser)}

        case DELETE_USER:
            const filteredItems = state.account.filter(cb => cb.id !== action.deleteCb)
            return {account: filteredItems }
 
        default: 
            return state
    }
}
export default USerReducer

Redux action

export const DELETE_COOKBOOK = 'CLEAR'
export const deleteCookbook = (deleteCb) => {
    return {type: DELETE_COOKBOOK, deleteCb: deleteCb}
}

console logging selectedUser

[
    Object {
          "id": 1595444079901,
          "val": "Veveve",
    },

    name: John Snow,
    imageUri: 'file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Frn-first-app-e648c632-2715-4169-abf3-e0cdbe2ac7d5/ImagePicker/461b63af-a908-47e9-8841-d5d8f2c4eb67.jpg
file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Frn-first-app-e648c632-2715-4169-abf3-e0cdbe2ac7d5/ImagePicker/461b63af-a908-47e9-8841-d5d8f2c4eb67.jpg'
}
]

Try to change follow

const Viewer = (props) => {
    const userID = props.navigation.getParam('id')
    //Nothing is just a picture when there are no images
    import nothing from './Images/nothing.png'

    const selectedUser = useSelector(state => state.user.user.find(user => user.id === userID))
    const cBimageUri = selectedUser.imageUri // --> changed it
    const checkImage = cBimageUri.length === 0? nothing : cBimageUri
    //const cBimageUri = {uri: selectedUser.imageUri } // is it a right row? just repeat previous 

    const deleteCb = useCallback(() =>{
        dispatch(deleteUser(userID))
        props.navigation.goBack()
    },[userID])

    useEffect(() => { 
        props.navigation.setParams({deleteCb: deleteCb})
    },[deleteCb])

    return (
        <ScrollView style={{backgroundColor: 'white'}}>
            <Image source={{uri: checkImage}} style={styles.image}/> // --> changed it. Not sure about it, if it's not working check below link
            <Text style={styles.name}>{selectedCookBook.name}</Text>
        </ScrollView>
    )
}

export default Viewer

this link https://stackoverflow.com/questions/50249353/uri-vs-url-in-react-native

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM