Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
274 views
in Technique[技术] by (71.8m points)

javascript - 反应:未执行setState方法(REACT: setState method is not executed)

I've got a component who is child from another that when is mounted called a function called getData().(我有一个组件,该组件是另一个组件的子组件,在安装时称为函数getData()。)

This function after make some queries on the databse call to the method setState but this call doesn't work because doesn't change the value of loaded and is no exectuted the callback.(在对方法setState的databse调用进行一些查询之后,此函数无效,但此调用不起作用,因为它不会更改load的值并且不会执行回调。) The code of the component is :(该组件的代码是:) import React, {Component} from "react"; import {Determinator, MultiLang} from "react-multi-language"; import { getDataFromServer } from "./Functions"; import {GAME_STATS_BY_TEAM, TEAM_COMPETITION_STATS} from "../FEBCOM/Querys"; class TeamTableStandardStats extends Component { constructor(props){ super(); this.props = props; this.state = { loaded: false, lang: this.props.isFEB ? "es" : "en" }; } componentDidMount(){ this.getData(); } async getData(){ let params = [ {"###id_team_club###": this.props.id_team}, {"###id_competition###": this.props.id_competition} ]; let team_games_stats = {}; let team_comp_stats = {}; if (this.props.isFEB){ team_games_stats = await getDataFromServer(process.env.URL_FEB_API, GAME_STATS_BY_TEAM, params); team_comp_stats = await getDataFromServer(process.env.URL_FEB_API, TEAM_COMPETITION_STATS, params); }else{ team_games_stats = await getDataFromServer(process.env.URL_FIBA_API, GAME_STATS_BY_TEAM, params); team_comp_stats = await getDataFromServer(process.env.URL_FIBA_API, TEAM_COMPETITION_STATS, params); } console.log("getData() => Before setState"); this.setState = ({ loaded: true, // team_games_stats: team_games_stats.data.game_stats_by_team, // team_comp_stats: team_comp_stats.data.team_comp_stats }, () => { console.log("loaded: " + this.state.loaded); }); console.log("getData() => After setState"); } render(){ return( <div> <span>loaded: {this.state.loaded ? "YES" : "NO"}</span> { (this.state.loaded) ? <div> <h1>Tabla - {this.props.isFEB ? "Es FEB" : "Es FIBA"}</h1> <span>id_team: {this.props.id_team} - id_competition: {this.props.id_competition}</span> <span>Resumen: {this.state.team_comp_stats.length}</span> </div> : <h5> <Determinator> {{ es: "Cargando datos ...", en: "Loading data ..." }} </Determinator> </h5> } <MultiLang lang = {this.state.lang} /> </div> ) } } module.exports.TeamTableStandardStats = TeamTableStandardStats; These code when is exected writes in console.log:(这些代码在被期望时写入console.log中:) 在此处输入图片说明 How you can see the log which belongs to this instrucctions is not executed:(如何查看属于该说明的日志未执行:) console.log("loaded: " + this.state.loaded); And how loaded is false you can see this in the view:(以及如何加载为假,您可以在视图中看到:) 在此处输入图片说明 So, I have no idea why is not executing the method setState.(因此,我不知道为什么不执行setState方法。) What am I doing wrong?(我究竟做错了什么?)   ask by José Carlos translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You aren't calling setState at all in your code by the looks of it, you are setting it(从外观setState ,您根本没有在代码中调用 setState ,而是对其进行设置)

this.setState = ({ ... }) This line assigns the value of setState which is all wrong, setState is a function that you need to invoke to update the state ie(该行分配的setState值是错误的, setState是您需要调用以更新状态的函数 ,即) this.setState({ ... })

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...