在React Native的子组件中未调用componentDidMount

时间:2018-10-20 05:22:51

标签: javascript reactjs native

我有一个屏幕,其中我调用了许多子组件。但是componentDidMount永远不会在子组件中执行

更新:

export default class ViewRequestPopup extends React.PureComponent {
  constructor(props) {
    super(props);
    let today = moment(new Date()).format("YYYY-MM-DD");
    let eventData = {};
    eventData[today] = {
      selected: true,
      marked: false,
      selectedColor: "#4db2fa"
    };


    this.state = {
      selectedDate: "",
      commentValue: "",
      timeList: times,
      index: -1,
      eventData: eventData
    };
    this.onDayPress = this.onDayPress.bind(this);
  }

   componentDidMount()
   {
     alert("componentDidMount");
   }

  onDayPress(day) {
    let eventData = {};

    if (null != this.props.events) {
      this.props.events[0].srk_holiday.data.forEach(day => {
        eventData = {
          ...eventData,
          [day]: {
            selected: true,
            marked: false,
            selectedColor: "#6cb6d8"
          }
        };
      });

      this.props.events[1].special_events.data.forEach(day => {
        eventData = {
          ...eventData,
          [day.event_date]: {
            selected: true,
            marked: false,
            selectedColor: "#ef79c3"
          }
        };
      });
    }

    eventData[day.dateString] = {
      selected: true,
      marked: false,
      selectedColor: "#4db2fa"
    };

    this.setState({
      selectedDate: day.dateString,
      eventData: eventData
    });
  }

  renderRow = (item, index) => {
    return (
      <TouchableOpacity
        activeOpacity={1}
        onPress={() => {
          if (index !== this.state.index) {
            this.state.timeList[index].isSelected = true;
            if (this.state.index > -1) this.state.timeList[this.state.index].isSelected = false;
            this.setState({ index: index });
          }
        }}
      >
        <Text style={item.isSelected ? styles.timeSelected : styles.timeUnSelected}>{item.key}</Text>
      </TouchableOpacity>
    );
  };

  render() {
    const { visible } = this.props;
    const selectedDate = {};
    selectedDate[this.state.selectedDate] = {
      selected: true,
      marked: false,
      selectedColor: "blue"
    };
    if (visible) {
      return (
        <View activeOpacity={1} onPress={() => null} style={styles.modal}>
</View> );
    } else {
      return null;
    }

//主要组件

<ViewRequestPopup
          selectedStoneIds={this.state.selectedStoneIds}
          visible={this.state.isViewRequestVisible}
          closePopUp={() => this.closePopup()}
          saveViewRequest={this.saveViewRequest}
          events={this.props.events}
        />

  saveViewRequest = params => {
    this.setState({ isLoading: true });
    const url = API_SAVE_VIEW_REQUEST.replace("{USERNAME}", getKeyForValue(DBCONSTNTS.KEY_LOGIN_USER));
    this.props.saveViewRequestAction(url, params);
  };

1 个答案:

答案 0 :(得分:0)

您错过了import {Alert} from 'react-native

您的componentDidMount方法应为

componentDidMount(){ Alert.alert("Alert"); }