React-Native的收藏原理和state理解

由于收藏不需要外部变量的传入，所以不作为this.props的组件，从而声明在this.state中，而且有一个默认值，标示不选中

错误案例:、

这是初始化代码:

constructor(props){
    super(props);
     this.state={
         isFavorite:false,
         favoriteIcon:require('../../res/images/ic_unstar_transparent.png')
     }
}

这是收藏按钮被点击时触发的代码：

 let isFavorite=!this.state.isFavorite;

let favoriteButton=<TouchableOpacity
    onPress={()=>{
        this.setState({
            isFavorite:isFavorite,
            favoriteIcon:this.state.isFavorite?require('../../res/images/ic_star.png')
                :require('../../res/images/ic_unstar_transparent.png')

        })
        alert(this.state.isFavorite);
    }}

上述的onPress实现的逻辑是错误的，其原因在于不了解state的属性机制，如果想修改state中的属性，下面是个典型错误范例：

this.state.isFavorite= !this.state.isFavorite----->state中的属性是不能通过赋值而被修改的

正确姿势：

let isFavorite= ! this.state.isFavorite;

this.setState({

isFavorite: isFavorite

})

错误案例： 

this.setState({

isFavorite: ! this.state.isFavorite             ---------------1

favoriteIcon:this.states.isFavorite?require('../ic_star.png') :require('../ic_unstar.png')     ----------------2

})

注意上面的-1看似修改了isFavorite, 那么-2使用this.states.isFavorite应该是修改后的值，其实不是的！！！！

为了防止出现这种state修改错乱，我们规定在setState中不要使用this.state

注意如果写成this.setState={}是不会报错的，但也就不生效了！