Html 意外标记<；使用reactjs应用程序时_Html_Reactjs

Html 意外标记<；使用reactjs应用程序时

html reactjs

Html 意外标记<；使用reactjs应用程序时,html,reactjs,Html,Reactjs,我一直在关注一个视频教程，该教程显然使用JSBin来显示其代码，当我在本地尝试代码时，它对我不起作用。有人能帮我找出问题所在吗下面是代码 <!DOCTYPE html> <html> <head> <title>Redux basic example</title> <script src="https://unpkg.com/redux@latest/dist/redux.min.js"></sc

我一直在关注一个视频教程，该教程显然使用JSBin来显示其代码，当我在本地尝试代码时，它对我不起作用。有人能帮我找出问题所在吗

下面是代码

<!DOCTYPE html>
<html>

<head>
    <title>Redux basic example</title>
    <script src="https://unpkg.com/redux@latest/dist/redux.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.0/react.min.js" type = "text/babel"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.0/react-dom.min.js" type = "text/babel"></script>
</head>

<body>
    <div id='root'>

    </div>
    <script>
        const counter = (state = 0, action) => {
            switch (action.type) {
                case 'INCREMENT':
                    return state + 1
                case 'DECREMENT':
                    return state - 1
                default:
                    return state
            }
        };

        const Counter = ({ value}) => (<div>{value}</div>);

        const { createStore } = Redux;
        var store = createStore(counter);

        const render = () => {
            ReactDOM.render(
                <Counter value={store.getState()} onIncrement = {
                    () => store.dispatch({type: 'INCREMENT'})
                } 
                onDecrement = {
                    () => store.dispatch({type: 'DECREMENT'})
                } />,
                document.getElementById('root')
            );
        };

        store.subscribe(render);
        render();
    </script>
</body>
</html>


Redux基本示例
常量计数器=（状态=0，操作）=>{
开关（动作类型）{
案例“增量”：
返回状态+1
“减量”一案：
返回状态-1
违约：
返回状态
}
};
常量计数器=（{value}）=>（{value}）；
const{createStore}=Redux；
var store=createStore（计数器）；
常量渲染=（）=>{
ReactDOM.render(
dispatch（{type:'INCREMENT'}）
} 
onDecrement={
（）=>store.dispatch（{type:'DECREMENT'}）
} />,
document.getElementById（'root'））
);
};
存储。订阅（呈现）；
render（）；

您正在代码中使用JSX，在浏览器中执行之前，需要将其转换为标准javascript

 const Counter = ({ value}) => (<div>{value}</div>);

const计数器=（{value}）=>（{value}）；

查看

浏览器正在抱怨JSX代码。在将其包含在页面中之前，应该将其转换为常规Javascript。有几种方法可以做到：网页包，巴贝尔

查看创建react应用程序npm包以快速入门：

您能提供Jsbin URL吗？在本地运行时，控制台中是否存在任何错误？effy这里是jsbin的链接，是的，在本地运行时，我会得到错误标记