React-native problem summary

Remote debugger is in a background TAB which may cause apps to perform slowly

Keep that Chrome Tab at the front of the page and don’t minimize the window.

The solution is this is amazing. ⌘ to a few more pushes or to delete items on the simulator and reload will generally resolve this.

bad news: Metro V0.29.0 won’t work with RN 0.54 to 0.55 because it introduced a new config param that RN is not handling yet (we’re working on improving configuration compatibility between RN and metro).

good news: the actual fix needed to solve this issue is in the RN repo (7be3d1c), so cherry-picking it into the 0.54 and 0.55 branches and releasing a RN minor version will fix this. (cc @hramos, @grabbou ).

Or use the following command to resolve the problem

yarn cache clean&&yarnCopy the code

Two solutions

1. Turn off the http://localhost:8081/debugger-ui/ open again
2. Press Command + D to disable Debug JS Remotely

The solution is entered on the terminal

react-native link react-native-vector-iconsCopy the code

Then restart it

React-native version 0.53.0. See Wix/React-Native Interface #185

Solution Disable SS and VPN services and re-install react-native run-ios. Amazing…

There is also an official issue

The solution

react-native start --reset-cacheCopy the code

The final reason is that a component was not deleted 🤣

Reference: rebeccahughes/react – native – device – info# 251

Random Violation: View config not found for name red alert

The solution stackoverflow.com/questions/4…

Error using TouchableWithoutFeedback

This component must have at least one child. If it is multiple, it must be wrapped in a View. I can write it like this

render() { return( <TouchableWithoutFeedback style={{flex: 1}} onPress={dismissKeyboard}> <View style={{flex: 1}}>...... </View> </TouchableWithoutFeedback> ); }Copy the code

In Xcode



Can be

React Navigation TabNavigator Indicates the delay of a frame

The TAB ICONS below have a frame delay from the first icon to the second icon when the page loads

The solution defines initialLayout to prevent the delay of a frame in the react-native Tab-View rendering

Reference: github.com/react-nativ…

Solution Restart the simulator…

Add the click event to the headerRight of react- Navigation

The workaround first requires dynamically adding click events to componentDidMount(){}

componentDidMount(){
    this.props.navigation.setParams({
        navigatePress:this.navigatePress
    })
}Copy the code

then

NavigatePress = () => {alert(' click on headerRight'); console.log(this.props.navigation); }Copy the code

Now you can use the params method to retrieve the click event.

static navigationOptions = ({ navigation, screenProps }) => ({ title: navigation.state.params? navigation.state.params.title:null, headerRight:( <Text onPress={navigation.state.params? Navigation. State. Params. NavigatePress: null} > back < / Text >)});Copy the code

The Image tag does not support HTTP

The solution

For ios 9 and above, Https is the default request. To support Http, modify the info.plist file to add key-value pairs

When turning the page, there was a problem of random index change. At that time, I looked at the API and there was no problem until I located it

The title will not display the index found no problem, not random page flipping… “, and then on a page to see the title is relatively large, shaking, resulting in random page turning, and then look inside there are numbers and text, size is not the same, set the font is good… React-native swiper page flipping may be triggered by jitter, resulting in random page flipping. God pit bug, looking for 4 or 5 hours… 😡

A red alert appears that could not connect to Development Server

Solution Turn off VPN, or do not turn on global mode… It’s amazing