Question

我仍在学习对本机的反应，我试图检索API中的数据并将其作为自定义单选按钮返回，但是如果我调用API，则会收到此错误：

null不是对象（正在评估'this.props.activities.map'）

 {this.props.activities.map((val, index) => {
    let { key, type, placeholder } = val;

    if (type === "selection") {
      var buttons = [];

      placeholder.forEach((e, index) => {
        var selectedButton = img.findButton(e, true);
        var normalButton = img.findButton(e);

        buttons.push(
          <RadioButton
            key={index}
            value={e}
            element={<Image source={selectedButton} />}
            selectedElement={<Image source={normalButton} />}
            onPress={() => this.changeSelection(key, e)}
            selected={this.state[key]["value"]}
          />
        );
      });

      var rows = [],
        columns = [];
      var i = 0;

      buttons.forEach((e, index) => {
        rows.push(e);
        i++;

        if (i === 2 || index === buttons.length - 1) {
          //max buttons per row
          i = 0;
          columns.push(
            <View key={index} style={{ flex: 1, flexDirection: "row" }}>
              {rows}
            </View>
          );
          rows = [];
          i = 0;
        }
      });

      return (
        <View key={key} style={{ flex: 1, margin: normalize(20) }}>
          {columns}
        </View>
      );
    }
  })}

“ this.props.activites”来自此

let initialState = {
    activities: null,

};

export default function mainReducer(state = initialState, action) {
    switch (action.type) {
        case t.RECEIVE_ACT:
            return Object.assign({}, state, { actReceived: true, activities: action.activities });
        case t.EMPTY_ACT:
            return Object.assign({}, state, { actReceived: false, activities: null });
        default:
            return state;
    }
}

我想知道它怎么会变成空

Answer 1

activities的初始状态为null。因此，直到您从api得到响应为止，React都会使用null值呈现代码的那部分。您可以给activities: []作为初始值，也可以在map函数之前输入null是否为空，例如

{this.props.activities && this.props.activities.map((val, index) => {...

如果您要使用activities: []，则仍可以在地图之前进行检查，尽管它是可选的，但仍然很好，例如;

{this.props.activities.length && this.props.activities.map((val, index) => {...

Answer 2

server.register(require('fastify-http-proxy'), { upstream: 'http://my-api.example.com', prefix: '/api', // optional http2: false // optional })来自哪里？

它是异步的，因为它似乎在某个时刻是this.props.activities。

如果添加以下行，您应该不再看到此错误。

null

Answer 3

保罗的回答是防弹的，但是您也可以使用默认值来避免#define CLS_COMM_CONFIG PORT_0,BAUD_9600,DATA_BIT_8,ONE_STOP,NO_FLOW_CONTROL #define PLS_COMM_CONFIG PORT_1,BAUD_115200,DATA_BIT_8,ONE_STOP,NO_FLOW_CONTROL typedef enum _comm_config { _Zero=0, PORT_0=_Zero, BAUD_2400=_Zero, NONE=_Zero, HALF_STOP=_Zero, DATA_BIT_5=_Zero, NO_FLOW_CONTROL=_Zero, _One = 1, PORT_1=_One, BAUD_4800=_One, ODD=_One, ONE_STOP=_One, DATA_BIT_6=_One, _Two=2, PORT_2=_Two, BAUD_9600=_Two, EVEN=_Two, TWO_STOP=_Two, DATA_BIT_7=_Two, _Three=3, PORT_3=_Three, BAUD_19200=_Three, DATA_BIT_8=_Three, _Four=5, PORT_5=_Four, BAUD_115200=_Four, DATA_BIT_9=_Four, _BIG_ENUM=0xFFFFFFFF, }COMMConfig;

falsy values

React Native-TypeError：null不是对象

3 个答案: