相关疑难解决方法(0)

我想阅读onClick事件值属性.但是当我点击它时,我在控制台上看到类似的东西:

SyntheticMouseEvent {dispatchConfig: Object, dispatchMarker: ".1.1.0.2.0.0:1", nativeEvent: MouseEvent, type: "click", target

我的代码工作正常.当我运行时,我可以看到{column}但无法在onClick事件中获取它.

我的代码:

var HeaderRows = React.createClass({
  handleSort:  function(value) {
    console.log(value);
  },
  render: function () {
    var that = this;
    return(
      <tr>
        {this.props.defaultColumns.map(function (column) {
          return (
            <th value={column} onClick={that.handleSort} >{column}</th>
          );
        })}
        {this.props.externalColumns.map(function (column) {
          // Multi dimension array - 0 is column name
          var externalColumnName = column[0];
          return ( <th>{externalColumnName}</th>);
        })}
      </tr>
    );
  }
});

如何将值传递给onClickReact js中的事件？

我想传递父divID,点击该div或任何相同的子元素div.但我无法实现它.请告诉我我在哪里弄错了.代码如下:

viewMore: function(i,j){
        console.log('You clicked: ', i  );
    },

render : function(){
  var attributeId = "groups_";
  attributeId+= index;
  return(
  //parent div
    <div className="groups" id={attributeId} onClick={this.viewMore}>
        <div className="floatLeft"> Group Name: <h3>My Name</h3></div>
            <span className="floatRight typeCd">POC</span>
        <div className="clearfix"> Key Attributes: 
            <ul>
                <li> POC 1</li>
            </ul>
        </div>
    </div>
    )
};

我正在学习文档https://facebook.github.io/react/docs/state-and-lifecycle.html之后的反应组件

为什么我们需要在这里使用箭头功能:

this.timerID = setInterval(() => this.tick(), 1000);

为什么我不能说(显然它不起作用)

this.timerID = setInterval(this.tick(), 1000);

import React, { Component } from "react";
import FormUpdate from "../components/formUpdate";
import { fetchClothingItem, updateClothingItem } from "../actions/crud";

export default class Update extends Component {
    constructor(props) {
        super(props);

        this.state = {
          updateClothingItem: {}
        };
    }

    componentWillMount() {
        fetchClothingItem(this.props.match.params.postId)
        .then(data => {
        this.setState(state => {
          state.updateClothingItem = data;
          return state;
        });
        console.log("data", data);

        //HERE IT IS RETURNING EXPECTED DATA       

        console.log("this.state.updateClothingItem",this.state.updateClothingItem)    
          })
        .catch(err => {
            console.error("err", err);
        });
    }

    handleSubmit(data) {

        //HERE IT IS THROWING: 

        > "TypeError: Cannot read property 'state' of …

我正在尝试借助来在两个屏幕之间导航react-navigation。我可以navigate在render方法内部访问，因为它的范围也在该方法内部。

我应该在哪里声明，以便可以访问this的任何方法component。我正在尝试访问方法navigate内部，onPressButton但它给出了错误。

找不到变量：导航

import React, { Component } from "react";
import { View, Text, Image, Button, Alert, StyleSheet } from "react-native";
import styles from "./Styles";
import * as strings from "./Strings";
import RoundButton from "./RoundButton";
var DialogAndroid = require("react-native-dialogs");
import { StackNavigator } from "react-navigation";

export default class CreateMessageScreen extends Component {
  render() {  
    const { navigate } = this.props.navigation;

    return (
      <View style={styles.container}>
        <Image source={require("./img/create_message.png")} />
        <Text …

这可能听起来很傻，但我找不到这方面的指南。

我想要做的是更改update父级中命名的变量。

并在父 DOM 中执行以下操作：

 <Child update={this.state.update} />

在孩子中，而不是在渲染和返回（with const {update} = this.props）之间拾取它并且只能在 DOM 中使用它，我想在构造函数和渲染之间的部分拾取它并在那里的函数中使用它.

我是 Reactjs 新手。我正在尝试做一些非常简单的事情：当用户更改文本区域内的文本时，更新渲染函数内的 div。有什么建议么？

class HTMLEditor extends React.Component {
  
  constructor(props) {
    super(props);
    this.state = {value: 'Put here HTML'};
  }
  
  
  handleChange(e) {
    this.setState({value: e.currentTarget.value});
  }
 
  
  render() {
    return (
      <div>
      <textarea defaultValue={this.state.value} onChange={ this.handleChange } />
        <div>{this.state.value}</div>
      </div>
    );
  }
}

ReactDOM.render(
  <HTMLEditor />, 
  document.getElementById('container')
);

我现在正在学习使用Class语法创建React组件,并注意我现在必须声明这样的方法:

class Foo extends React.Component {
    ...
    bar = () => {
        this.setState({ ... })
    }    
}

而不是像这样:

class Foo extends React.Component {
    ...
    bar() {
        this.setState({ ... })  // won't work
    }
}

或者我不能用this.setState().

任何人都可以解释创建这样的方法与它们与函数原型的关系有何区别？

我在ES6 React代码中看到了很多

class Foo extends React.Component {
  bar = () => {
    console.log("bar")
  }

  baz() {
    console.log("baz")
  }
}

好像他们都定义方法bar和baz上Foo,但他们如何不同.