如何防止浏览器重复获取相同的href

时间:2017-06-26 03:17:10

标签: javascript reactjs

我是一名新生,我想写一个由teamId获取团队成员信息的反应部分。

反应代码

import React from 'react';
import PropTypes from 'prop-types';
import UserTable from './pm_user_table';
import {Form,Modal,Input,Button} from 'antd';
const FormItem = Form.Item;

class PMBody extends React.Component{
  constructor(props){
    super(props);
    this.state={
      curTeam:this.props.curTeam,
      memberList:[]
    }
  }
  componentWillMount(){
    console.log('component mount');

  }
  componentWillReceiveProps(nextProps){
    if(nextProps.curTeam !== this.state.curTeam){
      this.setState({curTeam:nextProps.curTeam});
    }
  }
  

  render(){
    let {getFieldProps} = this.props.form;
    const teamId = this.state.curTeam;
    var myFetchOptions={method: 'GET'};
	fetch("http://localhost:3001/teamMembers/" +this.state.curTeam,myFetchOptions)
	.then(response=>response.json())
	.then(json => {
				this.setState({memberList:json});
			}
	).catch(function(){
			console.log("error");
	});
    let memberList = this.state.memberList;
    const body = memberList !='' ?
      <UserTable dataSource={memberList}  actions={this.props.actions} />
    :
      ''
    ;

    return (
     
        <div>
          {body}
        </div>

     ) 
        
}

PMBody.PropTypes = {
  curTeam:PropTypes.string.isRequired,
  actions: PropTypes.object.isRequired
}

export default PMBody =Form.create({})(PMBody);

通过chrome devtool中的网络视图,浏览器似乎反复请求相同的URL。

enter image description here

enter image description here

那么为什么它会重复获取相同的网址?

1 个答案:

答案 0 :(得分:2)

你误解了render() method的目的。

当任何更改发生时,反应调用componentDidMount()以更新您的组件。它必须是纯粹的,不应与其他任何东西互动。

您应将其移至mkdir( $path, "0777", true ); // BAD - only creates /a/b mkdir( $path, 0777, true ); // GOOD - creates /a/b/c/d