在JS中应该如何分隔route.param常量？-前端问题

How should route.param constants be separated in JS?(在JS中应该如何分隔route.param常量？)

本文介绍了在JS中应该如何分隔route.param常量？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我的Reaction Native应用程序中包含以下内容：

Hub.js：

export default class Hub extends Component {
    static navigationOptions = {
        header: null
    };

    ...

    render() {
        return (
            <View style={{flex: 1}}>
                        <TouchableOpacity
                        onPress={() => {
                            this.props.navigation.navigate('Link', {
                              site: 'CB Practice Test 1',
                            });
                          }}
                        >
                            <Text>Practice Test #1</Text>
                        </TouchableOpacity>
                        <TouchableOpacity
                        onPress={() => {
                            this.props.navigation.navigate('Link', {
                              site: 'CB Practice Test 3',
                            });
                          }}>
                            <Text>Practice Test #3</Text>
                        </TouchableOpacity>
                        <TouchableOpacity
                        onPress={() => {
                            this.props.navigation.navigate('Link', {
                              site: 'CB Practice Test 5',
                            });
                          }}
                        >
                            <Text>Practice Test #5</Text>
                        </TouchableOpacity>
                        <TouchableOpacity
                        onPress={() => {
                            this.props.navigation.navigate('Link', {
                              site: 'CB Practice Test 6',
                            });
                          }}
                        >
                            <Text>Practice Test #6</Text>
                        </TouchableOpacity>
                    </View>
            </View>
        )
    }
}

webviewsFolder/Links.js：

export default function Links({ route }) {
   
    const link = route.params.site ===
    'CB Practice Test 1' ? 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-1.pdf' :
    'CB Practice Test 3' ? 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-3.pdf' :
    'CB Practice Test 5' ? 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-5.pdf' :
    'CB Practice Test 6' ? 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-6.pdf' :
    'https://www.kaggle.com/';

  return <WebView source={{ uri: link }} />;
}

我的问题是只有CB Practice Test 1和CB Practice Test 3返回它们应该返回的页面，但是CB Practice Test 5&；6的按钮将返回CB Practice Test 3的url。我不知道为什么会发生这种情况，我认为可能是语法错误，但如果是这样，我不确定这是什么，也不确定如何解决它。

解决方案

尝试将"Link"更改为"Links"

this.props.navigation.navigate('Link', { site: 'CB Practice Test 1', });

或尝试使用大小写替换速记。

export default function Links({route}){
let link;
switch(route.params.site){case 'CB Practice Test 1':
    link = 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-1.pdf'
case 'CB Practice Test 3':
    link = 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-3.pdf'
case 'CB Practice Test 5':
    link = 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-5.pdf'
case 'CB Practice Test 6':
    link = 'https://collegereadiness.collegeboard.org/pdf/sat-practice-test-6.pdf'
}
default:
'https://www.kaggle.com/';
}
return <WebView source={{ uri: link }} />;

这篇关于在JS中应该如何分隔route.param常量？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！