Comment résoudre le problème du lien de réaction qui ne saute pas

Solutions pour que le lien de réaction ne saute pas : 1. Désactivez JS à distance ; 2. Ajoutez un supplément au composant de route du chemin racine 3. Passez TouchableOpacity comme attribut du composant de lien.

L'environnement d'exploitation de cet article : système Windows7, React17.0.1, Dell G3.

Comment résoudre le problème du lien de réaction qui ne saute pas ?

react router native : le lien ne saute pas lorsqu'on clique dessus

rneembeds natif, il n'y a pas de réponse ou de saut en cliquant sur le contenu du composant TouchableOpacity

// App.js
const history = createMemoryHistory()
<Router history={ history }>
    <Switch>
        <Route path="/" component={ Home }/>
        <Route path="/test" component={ Test } />
    </Switch>
</Router>


// Home.js
<View>
    <Link to="/test">
        <TouchableOpacity key={ text } style={ styles.wrapper }>
            <Text style={ styles.text }>{ text }</Text>
        </TouchableOpacity>
    </Link>
</View>

1 Désactivez JS à distance

Je ne sais pas pourquoi TouchableOpacity est. provoqué après l’activation du débogage à distance Invalide. Après la fermeture, vous pouvez voir l'effet TouchableOpacity en cliquant dessus, mais vous ne pouvez toujours pas sauter

2 Ajoutez un supplément au composant de route du chemin racine

// App.js
<Router history={ history }>
    <Switch>
        <Route extra path="/" component={ Home }/> // 增加extra
        <Route path="/test" component={ Test } />
    </Switch>
</Router>

Parce que je ne suis pas familier avec le développement rn, j'avais au départ peur que cela se produise. a été causé par l'utilisation de createMemoryHistory, et plus tard, j'avais peur que la page saute, mais étant bloqué ou quelque chose comme ça, ma pensée s'est égarée

Enfin, je suis honnêtement allé sur github pour trouver un projet de base, et après avoir cherché différences petit à petit, j'ai découvert qu'il s'agissait d'un problème négligé

Le principe est en fait très simple https://www .cnblogs.com/superlizhao/p/9280122.html

J'ai ce problème car le routeur TouchableOpacity est passé. en tant qu'attribut du composant de lien

const linkParams = {
    pathname: '/star',
    state: { data: item },
}

<Link to={ linkParams } component={ TouchableOpacity }>
    <Item text={ item.text } index={ index }/>
</Link>

S'il y a à l'intérieur, cela ne provoquera aucun saut

Apprentissage recommandé : "

Tutoriel vidéo React

"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!