小编Kir*_*ran的帖子

我在package.json中添加了proxy，效果很好，但是在npm run build之后，CORS问题再次浮出水面，有人知道在React中npm run build之后如何处理CORS问题。

我试图使用各种方法在axios请求中添加标头。但是，我未能在axios请求中添加'Access-Control-Allow-Origin'：'*'。我的代码如下：

package.json

  "proxy": {
      "*":{ "target" : "http://myurl"}
   } 

GetData.js

  axios.defaults.baseURL = 'http://myurl';
  axios.defaults.headers.post['Content-Type'] ='application/json;charset=utf-8';
  axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*';
  axios.get(serviceUrl, onSuccess, onFailure)
  .then(resp => { 
        let result = resp.data;
        onSuccess(result);
  })
  .catch(error => {
        if(onFailure) {
            return onFailure(error);
        }
  })
 }

注意：它已从服务器端启用，目前仍无法使用。目前，我无法从服务器端更改代码，我的工作仅限于客户端。

我想知道如何在JSX中使用cloneElement语法.我阅读了Docs并尝试了一些例子,但仍然没有任何线索.

class ABC extends React.Component {
  constructor(props){
    super(props)
}
render() {
  return(
  <div>
    {React.cloneElement()}
  </div>
  )
}
}

我目前正在使用mongodb罗盘，我想创建类型为“文本”的索引。我按照https://docs.mongodb.com/manual/indexes/#single-field上给出的步骤进行操作。但是，我无法创建类型为“文本”的索引。在指南针GUI中，标题为“选择类型”的下拉列表中未显示“文本”类型。我有什么想念的吗？

提前致谢。

我写了以下代码：

function CreateModal({toggleCreatePorjectModal, fetchProjects}) {
    const [formObj, setFormObj] = useState({name: "", link: "", error: ""})


    function validateLinkAndCreateProject() {
        if(formObj.link.trim() === "" || formObj.name.trim() === "") {
            setFormObj(state => ({...state, error: "ALL fields are mandatory, please enter Project Name and Feed Link to create project."}))
            return
        }
        
        rssFeedParser(formObj.link.trim())
            .then((res) => {
                axios.post(`${ServerPath}/projects/create`, {
                    name: formObj.name, 
                    link: formObj.link
                })
                .then(response => {
                    if(response.data.error) {
                        setFormObj(state => ({...state, error: "Something went wrong. Please try again after some time."}))
                    } else {
                        fetchProjects()
                        toggleCreatePorjectModal(false) …

关于call（）工作的理论在许多网站上都有很好的解释。但是，我找不到任何网站可以正确解释正确的工作示例。

我写了以下代码：

export function* loadUser() {
    try {
    const user = yield call(getUser);
    yield put({type: 'FETCH_USER_SUCCESS', payload: user});

  } catch(error) {
    yield put({type: 'FETCH_FAILED', error});
  }
}    

在这里，我想使用call（）发送带有一些参数和一些标头的'get'请求，但是我不知道如何实现它。如果有时间，请用适当的工作示例（Codepen或jsFiddle）告诉它。

我遇到过很多关于如何进行组件嵌套的消息来源.如何为父母和孩子设置常见道具.但是,当我尝试在React中编写组件内部组件时,我未能获得成功的结果.我是新的反应,可能这是不可能的或可能是我写错了代码.

  class ABC extends React.Component {

   class DEF extends React.Component {
       render() {
       return (
       <div>
           <h1>Hiiii</h1>
       </div>
       );
   }
 }

render() {
   return (
    <div>
      <DEF />
    </div>
    );
 }
 }  

Redux.org告诉您要规范化您的状态，但这会造成一些混乱。

它告诉我们应该有以下格式的状态：

{
    simpleDomainData1: {....},
    simpleDomainData2: {....},
    entities : {
        entityType1 : {....},
        entityType2 : {....}
    },
    ui : {
        uiSection1 : {....},
        uiSection2 : {....}
    }
}

我可以通过两种方式实现这一目标。

案例 1：我有 3 个页面，主页、创建、提要页面。因此，我可以创建 homeReducer.js、createReducer.js、feedsReducer.js，每个化简器将具有 simpleDomainData1、simpleDomainData2、entities 和 ui。

情况 2：我可以为每个字段创建单独的减速器，例如 simpleHomeReducer.js、simpleCreateReducer.js、simpleFeedsReducer.js、entitiesReducer、uiReducer.js。

但我不明白哪种方法是正确的，为什么？

我有两个例子。在第一个示例中，我在 JSX 中使用了 this.handleClick() 但它不起作用。但是，在第二个示例中，我在 JSX 中使用了 this.handleClick 并且它有效。我想，我缺少一些基础知识。

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

this.state = {counter: 0};
this.handleClick = this.handleClick.bind(this);
} 

handleClick() {
this.setState({counter: this.state.counter + this.props.increment});
}


render() {
return(
  <div>
    <p> Current counter is {this.state.counter} </p>
    <button onClick={this.handleClick()} > Click here </button>
  </div>
  );
  }
  }


  function App() {
  return (
  <div>
      <MyComponent increment={5} />
  </div>
 );
 } 

我目前正在阅读React官方网站，在那里遇到了这个问题。React官方网站指出，我们可以在JSX内部使用功能代码。因此，我尝试了以下代码，但无法正常工作。

ABCD类扩展了React.Component {

render() {
    return (
        <div>
            <p>
                {() => <div>Hello World </div>}
            </p>
        </div>
    );
}

}

我知道，我知道，有些人可能会说请参见React网站上给出的示例。我看到了，官方网站上的示例涉及外部功能。我只想知道我们可以在JSX内部独立使用函数。

请参阅此链接以获取更多信息：https : //reactjs.org/docs/jsx-in-depth.html