小编Akh*_*l P的帖子

当我将子组件的状态发送到其父组件时，React 将旧状态发送到父组件。

我想在每次单击 ListItem 时发送更新的状态，该状态正常工作并调用函数 handleItemClick。

但是当我打电话时sendStateToParent。它正在过去它的旧状态。假设我点击了ITEM1，它正在发送空数组[]。接下来我点击了ITEM2，它正在发送数组[ITEM1]。

在这里，我实际上是在创建一个多选下拉列表。它也可以作为基于它获得的道具的单一选择。

import React from 'react';
import ListItemComponent from './ListItem.jsx';
import DropDownButtonComponent from './DropDownButton.jsx';
import DropDownStyle from '../../../../css/sass/drop-down.scss';

module.exports = React.createClass({
  handleClick: function () {
    this.setState({open: !this.state.open});
  },
  getInitialState: function () {
    return {
      open: false,
      //listItems: this.props.listItems,
      selectedItems:[],
      title: this.props.dropdownTitle
    }
  },
  handleItemClick: function (item) {
    var selectedItems = [];
    if(this.props.multiple == true){
      selectedItems = this.state.selectedItems;
      if(selectedItems.indexOf(item)==-1){
        selectedItems.push(item);
      }else{
        selectedItems.splice(selectedItems.indexOf(item),1)
      }
      this.setState({
        title: …

假设我有一个如下组件.

User extends React.Component {
  componentDidMount() {
    this.props.fetchUserDetails(this.props.params.userSlugName);
    // this slug name is coming from route params (ex: path is /users/:userSlugName)
  }
  // Other lifecycle methods
}

User.loadData = () => {
  // some data fetching logic for backend
}

我正在使用react-router v4和react-router-config设置.我的想法已经不多了.如何在服务器中获取userSlugName.

现在,我如何在Server for SSR中预取这些详细信息才能正常工作.

我只想知道是否可以从组件中安全地删除反应组件道具.

有没有像这样的功能

this.destroyProps({someProp})

我试图改变图像源url from it's child component. If they clicks on button1 index 0 of backgroundImages阵列`将是图像源.button2将是索引1,按钮3将是索引2.

但它显示setstate在现有状态转换期间无法更新.

下面我附上代码.

App.jsx

var React = require('react');
var ReactDOM = require('react-dom');
var ChildComponent = require('./child-component.jsx');

var Hello = React.createClass({
  getInitialState: function(){
    return{
      backgroundImage: 'https://images.unsplash.com/photo-1464013778555-8e723c2f01f8?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=4b2c415f63f63afa66a347f993351bee'
    };
  },
  handleBackgroundChange: function(imageIndex) {
    this.setState({
      backgroundImage: this.backgrounds[imageIndex]
    });
  },
  backgrounds: [
    'https://images.unsplash.com/photo-1464013778555-8e723c2f01f8?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=4b2c415f63f63afa66a347f993351bee',
    'https://images.unsplash.com/photo-1463595373836-6e0b0a8ee322?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=69a198dc9bfba968b5deb20c04cec8c9',
    'https://images.unsplash.com/photo-1462819067004-905a72ea3996?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=4832f28a526c7a3538a887b8fbbfe897'
  ],
  render: function() {
    return(
      <div>
        <img src={this.state.backgroundImage} height="400px" width="400px"/>
        <ChildComponent handleBackgroundChange = {this.handleBackgroundChange}/>
      </div>
    );
  }
});

var element = React.createElement(Hello, {});
ReactDOM.render(element, document.querySelector('.container')); …

我想在elasticsearch中搜索。我使用 mongoosastic 作为 Elasticsearch 的驱动程序。我想搜索一个字符串是否存在于一个字段中，并且我想搜索另一个字段是否应该完全匹配。我怎样才能在 mongoosastic 中做到这一点？

我面临一个问题，我无法将react-helmet和 与styled-component一起使用next.js。

在 next.js 提供的示例中，它们使用不同存储库中的每个包。任何人都可以解决这个问题吗？