Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ComponentWillMount warning

I am creating a layout with inside. I am getting to this scene from another. So at the beginning another layout is rendered. After i go to the second scene (with TextInput tag) i obtain warnings such as:

componentWillMount is deprecated and will be removed in the next major version. Use componentDidMount instead. As a temporary workaround, you can rename to UNSAFE_componentWillMount. Please update the following components: App, Container, Image, Text< TouchableOpacity, Transitioner, View.

This is very strange, because I am not using componentWillMount method, so i guess that it is implicitly called.

This is the code of the component with

 class MainTopBarAfterSearch extends Component {
constructor() {
    super();
    this.state = { text: " " };
}

render() {
    const { topBarContainer, imageStyle, textInputStyle } = styles;
    return (
        <View style={topBarContainer}>
            <TouchableOpacity onPress={() => Actions.menu()}>
                <Image
                    source={require("../../../resources/menuWhite.png")}
                />
            </TouchableOpacity>
            <TextInput
                style={textInputStyle}
                placeholder="Begin to search"
                value={this.state.text}
                onChangeText={text => this.setState({ text })}
            />
            <Image source={require("../../../resources/filter.png")} />
        </View>
    );
}
}
like image 946
John Wilkinson Avatar asked Mar 07 '18 13:03

John Wilkinson


People also ask

Why is componentWillMount unsafe?

These methods are considered “unsafe” because the React team expect code that depends on these methods to be more likely to have bugs in future versions of React. Depending on the objective of the code, you can remove the use of componentWillMount entirely with other lifecycle methods.

What is the replacement for componentWillMount?

The function is replaced with class constructor.

What is componentWillMount used for?

The componentWillMount() method allows us to execute the React code synchronously when the component gets loaded or mounted in the DOM (Document Object Model). This method is called during the mounting phase of the React Life-cycle.

Is componentWillMount call every time?

No, componentWillMount is called only once.


1 Answers

Yes, because the componentWillMount and componentWillReceiveProps getting deprecated soon in React. I suggest you to use componentDidMount instead of componentWillMount.

But you will still get those yellow box warnings because react-native is still using those for the internal components like Image, TouchableOpacity and a lot of other components. We need to wait for a new update to get rid of those warnings. Don't worry, Happy coding.

like image 167
syam s Avatar answered Oct 04 '22 06:10

syam s