React native 摄像头不显示、状态转换问题、反应本机

我一直在尝试在touchableopacity onPress上保存一个异步存储项，然后导航到react本机相机屏幕

问题是：相机屏幕变得空白。我遇到以下错误：警告：无法在现有状态转换期间更新（例如在“render”或其他组件的构造函数中）。渲染方法应该是道具和状态的纯函数；构造函数的副作用是反模式的，但可以移动到“componentWillMount”

第27、36和41行的警告点（在AddParameters类）

代码如下：

AddParameters.js

import React, { Component } from 'react';

import {
  Text,
  AsyncStorage,
  View,
  TouchableOpacity,
} from 'react-native';

class AddParameters extends Component {
  constructor() {
    super()
    this.state = {
      localIds: [
        "data1",
        "data2",
        "data3",
        "data4",
        "data5",
        "data6"
      ],
    }
  }

  renderScreen = () => {
      return (
            <TouchableOpacity onPress={this._AddParameter(this.state.localIds[0])}>
              <Text>Click Me</Text>
            </TouchableOpacity>
      );
  }

  _AddParameter = (ParameterId) => {
    const { navigate } = this.props.navigation;
    AsyncStorage.setItem("myparam", ParameterId);
    navigate("CameraScreen");
  }

  render() {
    return (
      this.renderScreen()
    );
  }
}



export default AddParameters;

import React，{Component}来自'React'；
进口{
文本
异步存储，
看法
可触摸不透明度，
}从“反应本机”；
类AddParameters扩展组件{
构造函数（）{
超级（）
此.state={
地方：[
“数据1”，
“数据2”，
“数据3”，
“数据4”，
“数据5”，
“数据6”
],
}
}
渲染屏幕=（）=>{
返回(
点击我
);
}
_AddParameter=（ParameterId）=>{
const{navigate}=this.props.navigation；
AsyncStorage.setItem（“myparam”，ParameterId）；
导航（“摄像机屏幕”）；
}
render（）{
返回(
这个文件名为renderScreen（）
);
}
}
导出默认参数；

CameraScreen.js

'use strict';
import React, { Component } from 'react';
import {
  AppRegistry,
  Dimensions,
  StyleSheet,
  Text,
  View,
  Image,
  AsyncStorage,
} from 'react-native';
import Camera from 'react-native-camera';

class CameraScreen extends Component {

  constructor(props) {
    super(props);
    this.state = {
      mystate: '',
    };
  }

  renderCamera = () => {
    return (
      <Camera
        ref={(cam) => {
          this.camera = cam;
        }}
        style={stylesCamera.container}
        aspect={Camera.constants.Aspect.fill}>
      </Camera>
    );
  }

  render() {
    return (
      this.renderCamera()
    );
  }
}

const stylesCamera = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "transparent",
  },
});

export default CameraScreen;

“严格使用”；
从“React”导入React，{Component}；
进口{
评估学，
尺寸，
样式表，
文本
看法
形象
异步存储，
}从“反应本机”；
从“react native Camera”导入相机；
类CameraScreen扩展组件{
建造师（道具）{
超级（道具）；
此.state={
我的国家：''，
};
}
renderCamera=（）=>{
返回(
{
这个摄像头=凸轮；
}}
style={stylesCamera.container}
aspect={Camera.constants.aspect.fill}>
);
}
render（）{
返回(
这个是renderCamera（）
);
}
}
const stylesCamera=StyleSheet.create({
容器：{
弹性：1，
辩护内容：“中心”，
对齐项目：“中心”，
背景色：“透明”，
},
});
导出默认摄像机屏幕；

---

任何解释都会有帮助。提前感谢。

在您的AddParameters文件中，尝试更改以下内容：

<TouchableOpacity onPress={this._AddParameter(this.state.localIds[0])}>

致：

this.\u AddParameter（this.state.localIds[0]）}>

成功了！谢谢

<TouchableOpacity onPress={() => this._AddParameter(this.state.localIds[0])}>