从JSON到Picker输入元素

我是React Native的新手。我正在尝试将网络服务进行fecth，并输入一些元素，从响应对选择器（我使用本机基础）。我的问题是我不知道如何拿一个元素（这里是 LIBELLE）我在json中需要什么。

请参阅代码：

getSurfaces(){
    fetch('yourWebservice')
        .then((response) => response.text())
        .then((responseText) => {
            parseString(responseText, function (err, result) {
                responseText = result;
            });
            console.log(JSON.stringify(responseText));
            this.setState({
                surfaces: responseText.Surfaces.surface
            }).catch(err => console.log(err));
            console.log(this.state.surfaces);
            }
        })
        .catch((err) => {
            console.log('Error fetching the feed: ', err)
        })
}
componentDidMount(){
    this.getSurfaces();
}

我的构造函数：

constructor (){
    super();
    this.state = {
        date: '',
        surface: '',
        surfaces: [],
        start: '',
        hours : [],
    };
    this.valueChangeSurface = this.valueChangeSurface.bind(this);
}
valueChangeSurface(value: String){
    this.setState({
        surface: value
    });
}

我的RenderSurfaces方法：

renderSurface(){
    if(this.state.surfaces){
        return this.state.surfaces.map((surface) => {
           return <Picker.Item label={surface.LIBELLE} value={surface}/>
        })
    }
}

选择器的渲染：

<ListItem>
    <Left>
        <Text>Surface</Text>
    </Left>
    <Body>
        <Picker
            note
            inlineLabel={true}
            mode={"dropdown"}
            style={{width: 175}}
            selectedValue={this.state.surface}
            onValueChange={this.valueChangeSurface}>
            {
                this.renderSurface()
            }
        </Picker>
    </Body>
    <Right/>
</ListItem>

this.setState在getSurfaces()中返回的错误：

错误获取提要：[typeError：undefined不是对象（评估'_this2.setstate（{{{ 表面：ResponseText.surfaces.surface }）。捕获'）]

我真的不知道我是否采取了好方法来做到这一点，我真的很感谢您的帮助

JSON.stringify()将JS对象转到JSON字符串。而且，您不需要在对象上进行交互以设置状态。

this.setState({
     surfaces: responseText.Surfaces.surface;
});

您已经表面有一个JS对象。

在您的代码中，当您呈现组件时，您正在通过JSON字符串对象进行交互，并给予result最后一个JSON对象，

{"ID":["4"],"LIBELLE":["Quicks"],"CODE":["QUICKS"],"ORDRE":["4"]}

进入JSON字符串对象，

'{"ID":["4"],"LIBELLE":["Quicks"],"CODE":["QUICKS"],"ORDRE":["4"]}'

在渲染组件之前，您可以渲染表面，例如

renderSurfaces() {
    if (this.state.surfaces) {
        return this.state.surfaces.map((surface) => {
            return (
                    <Text>
                        {surface.LIBELLE}
                    </Text>
            );
        });
    }
}

我终于找到了一个解决方案：

问题很简单，其中大部分来自语法，我替换：

responseText.Surfaces.surface.LIBELLE

由此：

responseText.Surfaces.surface[i].LIBELLE

请参阅geturfaces的整个代码（）：

getSurfaces(){ // Input the surfaces values (ID and LIBELLE) who come from WebService in the this.state.surfaces
    fetch('url')
        .then((response) => response.text())
        .then((responseText) => {
            parseString(responseText, function (err, result) {
                responseText = result;
            });
            let sf = []; // Create a table who gonna content the value of this.state.surfaces
            for(i = 0; i<responseText.Surfaces.surface.length; i++){
                sf.push(responseText.Surfaces.surface[i].LIBELLE.toString());
            }
            this.setState({
                surfaces: sf //inject the table sf who contain the table surfaces
            });
        })
        .catch((err) => {
            console.log('Error fetching the feed: ', err)
        })
}

您必须为选择器提供一个对象。现在，您将对象转换为字符串，而是将其转换为：

surfaces.forEach(result => {
    this.setState({
        surfaces: result
    });
    console.log(this.state.surfaces);
}

surfaces.forEach(e => {})与您的循环相同，只是简单一点。请记住，您不需要使用这种循环（foreach，地图）几乎总是在JS中。如果这无济于事，请发布您的选择器的HTML片段。

相关内容

最新更新

热门标签：