2017-04-17 13 views
0

eslint-plugin-reactプラグインを使用して反応成分のESLintと矢印機能に問題があります。ESLint eslint-plugin-react arrow functions

  1. npm i -g eslint eslint-plugin-react
  2. eslint SignUpPage.jsx

そして、ここではSignUpPageです:私は、これらのコマンドをした

/** 
* Created by jwilso37 on 4/5/2017. 
*/ 

import React from 'react'; 
import SignUpForm from '../components/landing/SignUpForm.jsx'; 
import 'whatwg-fetch' 


class SignUpPage extends React.Component { 

    constructor(props) { 
     super(props); 

     this.state = { 
      errors: {}, 
      user: { 
       email: '', 
       name: '', 
       password: '' 
      } 
     }; 
    } 

    /** 
    * Change the user object. 
    * 
    * @param {object} e - the JavaScript event object 
    */ 

    changeUser = (e) => { 
     const field = e.target.name; 
     const user = this.state.user; 
     user[field] = e.target.value; 

     this.setState({ 
      user 
     }); 
    }; 

    /** 
    * Handles processForm event and submits request to server. 
    * @param e 
    */ 
    processForm = (e) => { 
     e.preventDefault(); 
     const form = document.querySelector('form'); 
     const formData = new FormData(form); 

     fetch('/api/signup', { 
      method: 'POST', 
      body: formData 
     }).then(response => { 
      if (response.ok) { 
       this.setState({ 
        errors: {} 
       }); 
      } 
      else { 
       // returned > 300 status code 
       response.json().then(j => { 
        const errors = j.errors ? j.errors : {}; 
        errors.summary = j.message; 
        this.setState({ 
         errors: errors 
        }) 
       }) 
      } 
     }) 
    }; 


    /** 
    * Render the component. 
    */ 
    render() { 
     return (
      <SignUpForm 
       onSubmit={this.processForm} 
       onChange={this.changeUser} 
       errors={this.state.errors} 
       user={this.state.user} 
      /> 
     ); 
    } 

} 

export default SignUpPage; 

しかしeslintの出力は奇妙これです:

[email protected]:/vagrant/client/src/containers$ eslint signuppage.jsx 

/vagrant/client/src/containers/signuppage.jsx 
    31:16 error Parsing error: Unexpected token = 

匿名機能changeUser=サインに誤りがありますか?ここに私の.eslintrc.json

{ 
    "plugins": [ 
    "react" 
    ], 
    "settings": { 
    "react": { 
     "createClass": "createClass", // Regex for Component Factory to use, default to "createClass" 
     "pragma": "React", // Pragma to use, default to "React" 
     "version": "15.0" // React version, default to the latest React stable release 
    } 
    }, 
    "parserOptions": { 
    "sourceType": "module", 
    "ecmaVersion": 6, 
    "ecmaFeatures": { 
     "jsx": true 
    } 
    }, 
    "extends": ["eslint:recommended", "plugin:react/recommended"], 
    "env": { 
    "browser": true 
    } 
} 
+0

あなたは正しい、それは正しい構文です。私は私の答えを削除しました – chazsolo

答えて

2

私はそれを固定したようだった。私はbabel-eslintnpm i --save-dev babel-eslintをインストールしました。JSXスプレッド演算子もうまく動作していないことに気付きました。それは私に、ES6のすべてのものが混乱していると思うようにしました。だから今私は.eslintrc.jsonファイルの末尾に"parser": "babel-eslint"を追加してbabel-eslintパーサーを追加して、すべてが良いです!私は、デフォルトのeslintパーサーがこれらの機能をサポートしていないと思います...

+0

本当に働いて、私はあなたの決議を読むことを改善するための変更を加えました – Malaba