Могу ли я установитьState в статическом методе с помощью react native?
В моем компоненте есть статический метод:
static updatestate(totalCount,totalCost){
this.setState({totalCount,totalCost});
}
Мне нужно только создать статический метод для передачи данных в компонент. Но, как вы знаете, мы не можем использовать this в статических методах. Есть ли способ передать данные нестатическому методу без создания нового экземпляра и без создания реквизитов. следующим образом:
import MyComponentName from './MyComponentName.js';
MyComponentName.MyMethod(params)
Спасибо.
Ответы 1
Как вы заявляете, вы не можете использовать this в статических методах.
Если вы пытаетесь вызвать метод для конкретного экземпляра компонента, используйте ref для этого экземпляра. Предположим, вы хотите вызвать updateState на этом компоненте:
class ChildComponent extends React.Component {
state = {totalCount: 0, totalCost: 0};
updateState = (totalCount, totalCost) => {
this.setState({totalCount, totalCost});
}
render() {
const {totalCount, totalCost} = this.state;
return <Text>totalCount: {totalCount} totalCost: {totalCost}</Text>;
}
}
Вы получите ref для экземпляра, а затем можете вызвать updateState:
class ParentComponent extends React.Component {
render() {
return (
<View>
<ChildComponent ref = {child => {
this.child = child; // gets a ref to the child component
}} />
<TouchableOpacity onPress = {() => {
const {totalCount, totalCost} = this.child.state;
this.child.updateState(totalCount + 1, totalCost + 10); // call method on child component
}}><Text>press</Text></TouchableOpacity>
</View>
);
}
}
(Если вместо этого вы хотите использовать setState для экземпляров компонента все, вам может быть лучше предложить использование React.createContextProvider, в котором ChildComponent может быть Consumer).
Работает для меня? У меня есть точный код, приведенный выше, со следующими изменениями: 1. У меня есть компоненты в двух файлах, ParentComponent.js и ChildComponent.js 2. Я изменил class на export default class 3. У дочернего компонента есть import React from 'react'; и import {Text} from 'react-native'; 4. У родительского компонента есть import React from 'react';, import {Text, TouchableOpacity, View} from 'react-native'; и import ChildComponent from './ChildComponent'; 5. Я включили <ParentComponent /> в мое приложение. Если у вас все еще есть проблемы, опубликуйте свое приложение в репозитории Github, и я посмотрю
Спасибо Вам большое! но когда я запускаю этот код, я получаю эту ошибку: Undefined не является объектом (оценка this.child.updatestate)