gpt4 book ai didi

reactjs - React-Redux @connect 语法错误

转载 作者:行者123 更新时间:2023-12-03 13:33:16 29 4
gpt4 key购买 nike

我是 React 和 Redux 的新手,我正在构建一个简单的 todos 应用程序。我正在命令行中使用 create-react-app 工具编写我的应用程序。

问题

我去了其他博客和帖子,其他人提到我缺少一个 npm 插件来转换装饰器“transform-decorators-legacy”,我将其与 Babel 一起添加到我的依赖项中,但我仍然收到相同的错误.

Syntax error: Unexpected token (9:0)

7 | import './App.css';
8 |
> 9 | @connect((store) => {
| ^
10 | return {
11 | user: store.user.user
12 | }

我的代码

import React, { Component } from 'react';
import { connect } from 'react-redux';

import Todos from './components/Todos';
import Todo from './components/Todo';

import './App.css';

@connect((store) => {
return {
user: store.user.user
}
})
class App extends Component {
constructor(){
super()
this.state = {
name: 'Brad',
todos: [
{
id: '001',
name: 'Take out trash',
completed: false
},
{
id: '002',
name: 'Meeting with boss',
completed: false
},
{
id: '003',
name: 'Go out to dinner',
completed: false
}
]
}
}
render() {
return (
<div className="App">
<h1>Hello</h1>
<Todos name={this.state.name} todos={this.state.todos}/>
<Todo/>
</div>
);
}
}

export default App;

我的依赖项

package.json

{
"name": "react-redux-project",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.16.2",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"react-redux": "^5.0.6",
"redux": "^3.7.2",
"redux-logger": "^3.0.6",
"redux-promise-middleware": "^4.3.0",
"redux-thunk": "^2.2.0"
},
"devDependencies": {
"babel": "^6.23.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"react-scripts": "1.0.11"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}

任何帮助/知识将不胜感激!

最佳答案

首先我要指出的是,我同意@markerikson的答案,使用函数而不是装饰器。

如果您确实想要使用装饰器,则还需要执行几个步骤。您已将插件添加到依赖项中,但没有告诉 Babel 使用它。

Create React App 在底层使用 Webpack 和 Babel,即在 React-scripts 中。您需要调整 Babel 配置。 “创建 React 应用程序”的方法是 eject从 Create React App 然后编辑 .babelrc - 请参阅 https://babeljs.io/docs/plugins/transform-decorators/#usage-via-babelrc-recommended-

关于reactjs - React-Redux @connect 语法错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45695981/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com