Question

当用户点击列表中的行时，我尝试打开相关记录的编辑屏幕。我在调试器上看到所有道具都成功通过，但是以某种方式我无法在屏幕上显示它们。我进行了很多搜索，我认为主要问题在于onRowPress帮助程序。当我按下该行时，我在调试器中看到所有道具均已正确传递。但是有一个错误提示

道具类型失败：提供给类型value的道具array无效 TextInput，预期string。

我的问题是我应该如何处理此错误。

console.log

 onRowPress() {
        console.log(this.props.employee);
        Actions.employeeEdit({ employee: this.props.employee });
      }

Answer 1

我想您正在参加“完整的React Native和Redux课程”，如果是这样，我很想念您：

-1 import Communications from "react-native-communications";

-2

class EmployeeEdit extends Component {
  state = { showModal: false };
  ...

3-在您的render()上方：

onTextPress() {
  const { phone, shift } = this.props;

  Communications.text(phone, `Your upcoming shift is on ${shift}`);
}

onAccept() {
  const { uid } = this.props.employee;

  this.props.employeeDelete({ uid });
}

onDecline() {
  this.setState({ showModal: false });
}

-4最后，您的主要render()应该是：

<Card>
  <EmployeeForm />

  <CardSection>
    <Button onPress={this.onButtonPress.bind(this)}>Save Changes</Button>
  </CardSection>

  <CardSection>
    <Button onPress={this.onTextPress.bind(this)}>Text Schedule</Button>
  </CardSection>

  <CardSection>
    <Button onPress={() => this.setState({ showModal: !this.state.showModal })}>
      Fire Employee
    </Button>
  </CardSection>

  <Confirm
    visible={this.state.showModal}
    onAccept={this.onAccept.bind(this)}
    onDecline={this.onDecline.bind(this)}
  >
    Are you sure you want to delete this?
  </Confirm>
</Card>;

Answer 2

这需要时间，但我解决了问题。主要问题是以下错误；

失败的prop类型：提供给type数组的无效prop值 TextInput，期望的字符串。

我一步一步地遵循了所有代码，发现用我传递的值更新道具的reducer无法做到这一点。我在action.payload.value中添加了toString（）方法，一切正常。您必须将字符串传递给Input组件。

export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case EMPLOYEE_UPDATE:
      return { ...state, [action.payload.prop]: action.payload.value.toString() };
    case EMPLOYEE_CREATE:
      return INITIAL_STATE;
    case EMPLOYEE_SAVE_SUCCESS:
      return INITIAL_STATE;
    default:
      return state;
  }
};

编辑屏幕字段未在“ react-native”中填充

2 个答案: