为什么scrollView在我的代码中不能以垂直方式工作?

时间:2019-02-05 07:33:58

标签: javascript android reactjs react-native

在我的本机代码中,当我将scrollView置于水平方向而不是正常工作时,我想以垂直方式滚动显示数组值,但实际上我需要垂直方式。

              {this.state.status? (                 

             <ScrollView horizontal pagingEnabled snapToInterval={300} directionalLockEnabled={true} >

          {
             this.state.newArr.map((item, index) => (

                <View  key = {item.id}>
                   <Text style={{color:"green",fontSize:14}} >{item.text}</Text>
                </View>

             ))
          }
       </ScrollView>
        <View style={{ paddingLeft: 5 }}>
                {this.state.status ? (
                  <View style={styles.SectionStyle2}>
                    <TextInput
                      placeholder="Type....."
                      ref="textInput"
                      value={this.state.inputValue}
                      maxLength={500}
                      fontSize={14}
                      multiline={false}
                      underlineColorAndroid="transparent"
                      style={{
                        flex: 1,
                        fontWeight: "bold",
                        paddingLeft: 5,
                        paddingRight: 0,

                        paddingTop: 0,
                        paddingBottom: 0
                      }}
                      blurOnSubmit={false}
                      autoFocus={true}
                      onChangeText={msg => this.setState({ msg })}
                    />

                    <TouchableOpacity
                      onPress={() =>
                        this.chatStart(this.doClear(this.viewChat()))
                      }
                    >
                      <Image
                        source={require("./SendMessage-35.png")}
                        style={{ height: 35, width: 35 }}
                      />
                    </TouchableOpacity>
                  </View>
                ) : null}
              </View>
            </View>
          ) : null}
        </View>

我希望数组数据可以垂直滚动。

2 个答案:

答案 0 :(得分:0)

看来水平属性“自动”为true。也就是说,如果包含的话,视图将水平滚动。希望这意味着默认值是垂直的,只需删除horizontal就足够了。 (我不确定,但这仍然是我的印象,部分原因是查看此资源): https://facebook.github.io/react-native/docs/using-a-scrollview

答案 1 :(得分:0)

只需添加ScrollView的nestedScrollEnabled Prop,然后使ScrollView完美运行即可。