Question

我有icon和value之类的status和0 or 1。如果thumbs up是icon，我想显示status 1如果thumbs down是status，则0和toggle。点击时

<View style={{marginTop:10}}><Icon  name={itemData.wliststatus===0?"thumbs-up":"thumbs-down"} size={16} type="font-awesome" onPress={() => this.navigateToApp(itemData)}/></View>

相同

API

从itemdata:{ "userid": "1", "views": "258", "wliststatus": 0, } <View style={{marginTop:10}}><Icon name={itemData.wliststatus===0?"thumbs-up":"thumbs-down"} size={16} type="font-awesome" onPress={() => this.navigateToApp(itemData)}/></View>

获取

# Override PostgreSQL image used to export using old binaries
printf "version: '2.1'\nservices:\n  postgresql:\n    image: docker.bintray.io/postgres:9.5.2\n" > image_override.yml
started_container=$(docker-compose -f artifactory-pro.yml -f image_override.yml run -d -v sql_dump_volume:/tmp/dump --no-deps postgresql)

# Dump database to a text file in a volume (to make it available for import)
docker exec "${started_container}" bash -c "until pg_isready -q; do sleep 1; done"
docker exec "${started_container}" bash -c "pg_dumpall --clean --if-exists --username=\${POSTGRES_USER} > /tmp/dump/dump.sql"
docker stop "${started_container}"
docker rm --force "${started_container}"

Answer 1

首先创建保存state variable的{{1}}，然后创建whliststatus value中function的{{1}}。

toggle value

Answer 2

使用state动态更改项目。
首先，在state变量中，将您喜欢的状态值设置为false。
请记住：state变量将全局存在于您的课程中

state = {
    liked: false
};

然后在componentDidMount中成功获取数据后，在状态下相应地更新您的状态：

componentDidMount() {
    fetch(...)
    .then(res => res.json())
    .then(res => {
        ...
        itemdata:{
            "userid": "1",
            "views": "258",
            "wliststatus": 0,
        }

        // here update "liked" status in state
        this.setState({ liked: itemdata.wliststatus == 0 ? true : false });
        ...
    })
    .catch(error => console.log(error));
}

现在，直接进入render方法，获取或设置状态，数据将自动处理：

render() {
    const { liked } = this.state;

    return (
        <View style={{marginTop:10}}>
            <Icon name={ liked ? "thumbs-up" : "thumbs-down" } 
            size={16} type="font-awesome" 
            onPress={() => this.navigateToApp()}/>
        </View>
    );
}

然后看来您可能正在this.navigateToApp函数中更新类似内容。在此方法中，您可以将状态更新为：

navigateToApp() {
    const { liked } = this.state;

    ...

    // here just switch your liked status
    this.setState({ liked: !liked });

    ...
}

如果值更改，图标也会更改

2 个答案: