小编Ash*_*Ash的帖子

我正试图在我的React项目中使用Airbnb的Javascript标准设置linting,它使用webpack.

根据评论更新了最新的软件包.

"babel-eslint": "^6.1.2",
"eslint": "^3.2.2",
"eslint-config-airbnb": "^10.0.0",
"eslint-plugin-import": "^1.12.0",
"eslint-plugin-jsx-a11y": "^2.0.1",
"eslint-plugin-react": "^6.0.0",
"jshint": "^2.9.2",
"jshint-loader": "^0.8.3",
"json-loader": "^0.5.4",

我的webpack配置中也有一个预加载器设置

preLoaders: [
    {
        test: /\.jsx?$/,
        loaders: ['eslint'],
        // define an include so we check just the files we need
        include: PATHS.app
    }
],

以下设置用于运行脚本

  "lint": "eslint . --ext .js --ext .jsx --ignore-path .gitignore --cache",

我还有一个.eslintrc文件,其中包含以下内容

{
  "extends": "airbnb",
   "env": {
      "node": true,
      "es6": true
   }
 }

这给了我以下错误:

Configuration for rule "react/jsx-sort-props" is invalid:
Value "data["0"].shorthandLast" has additional …

我试图在我的反应应用程序中从api渲染一些关于某个人位置的JSON.

我正在使用isomorphic-fetch从API访问数据我可以添加基本测试并使用下面正确记录数据.

 require('isomorphic-fetch');
 require('es6-promise').polyfill();

 var url = 'http://localhost:3000/api/data'

 fetch(url)
    .then(function(response) {
    if (response.status >= 400) {
       throw new Error("Bad response from server");
    }
    return response.json();
  })
  .then(function(data) {
     console.log(data);
  });

我正在尝试解决的是我如何能够在我的组件中获取此响应并将其呈现在当前看起来像这样的组件中(在此示例中,下面的代码数据来自本地json文件,因此我需要将它们合并在一起).

我已经尝试设置componentDidMount但是可以让我理解语法,所以它一直在破坏,我还检查了redux动作,但这让我大脑爆炸了.

const personLoc = Object.keys(data.person.loc).map((content, idx) => {
    const items = data.person.loc[content].map((item, i) => (
        <p key={i}>{item.text}</p>
    ))

    return <div key={idx}>{items}</div>
})

export default function PersonLocation() {
    return (
        <div className="bio__location">
            {personLoc}
        </div>
    )
}

我试图从这样的json中提取数据,这被导入为"值"

{
  "content": {
      "person": [
        {
          "name": "Test"
          "age" : "24:
        }
    ]
 }
}

我正在使用.map如下,但得到错误,.default.map is not a function我相信这是因为我有对象而不是数组,我尝试了一堆东西,object.keys但我在整个地方都得到错误,任何方向将不胜感激.

import values from './sample.json'

const vals = values.map((myval, index) => {
    const items = person.items.map((item, i) => {

        return (
            <div>{item.name}</div>
        )
    })

    return (
        <div>{items}</div>
    )
})