Question

我刚刚开始学习reactjs，我的第一个用例之一是创建一个按钮，根据用户是否单击打开/关闭，我将进行访存调用并将此信息传递给其中一个变量。每种按钮的功能。因此，我认为我可以将值作为prop传递，并将其用于fetch调用。当我尝试传递“ this.props.statusnumber”时，您会看到此消息。

不幸的是，我收到以下错误；解析错误：这是保留字...

这是我的代码，由于无法在线找到任何帮助，我们将不胜感激。

import React from 'react';


const API = 'https://use1-wap.tplinkcloud.com/?token=HIDDEN';
let opts = {"method":"passthrough", "set_dev_alias":{"alias":"supercool             plug"}, "params": {"deviceId": "HIDDEN", "requestData": "{\"system\":    {\"set_relay_state\":{\"state\":0}}}" }};
let headerInfo = {'Content-Type': 'application/json','Version':'1','q': '0.01'};
let statusnumber = {};

export class Name extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      position: "off",
      object: [],
    };
    this.switchStatus = this.switchStatus.bind(this);
    this.statusnumber = this.statusnumber.bind(this);
  }

  switchStatus() {
    opts.params.requestData = "{\"system\":{\"set_relay_state\ {\"state\":"+{this.props.statusnumber}+"}}}";
    let positionStatus = (this.props.statusnumber === 0) ? "off" : "on";
    console.log(this.props.statusnumber);
    fetch(API, {
        method : 'POST',
        headers: headerInfo,
        body : JSON.stringify(opts)
    })
      .then(response => response.json())
      .then(data => this.setState({ object: data.object, position:     positionStatus}))
  };


  render() {
    const { object } = this.state;

    return (

      <div>
      <button onClick={this.switchStatus} statusnumber={1}>On</button>
      <button onClick={this.switchStatus} statusnumber={0}>Off</button>
      <p>Current position: {this.state.position}</p>
      <p>testing function</p>
      </div>
    );
  }

}

将道具传递给函数

0 个答案: