Javascript-форум (https://javascript.ru/forum/)
-   Node.JS (https://javascript.ru/forum/node-js-io-js/)
-   -   react не распознает e в onclick (https://javascript.ru/forum/node-js-io-js/84123-react-ne-raspoznaet-e-v-onclick.html)

riaron86 06.06.2022 21:16

react не распознает e в onclick
 
выдает ошибку
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: C:\react\fundamental\src\App.js: The type cast expression is expected to be wrapped with parenthesis. (30:75)

28 |     <div className="App">
  29 |         <form>
> 30 |             <MyInput value={post.title} onChange={e=>setPost(...post, title: e.target.value)} type='text' placeholder='название поста'/>
     |                                                                            ^
  31 |             <MyInput value={post.body} onChange={e=>setPost(...post, body: e.target.value)} type='text' placeholder='название поста'/>
  32 |             <MyButton type="submit" onClick={addNewPost}>Создать пост</MyButton>
  33 |         </form>

Line 29:75: Parsing error: The type cast expression is expected to be wrapped with parenthesis. (29:75)

import React,{useState} from 'react';
import './styles/App.css';
import PostList from "./components/PostList";
import MyButton from "./components/button/MyButton";
import MyInput from "./components/input/MyInput";

function App() {
    const[posts,setPosts]=useState([
        {id:1,title:'javascript 1',body: "JavaScript-язык программирования"},
        {id:2,title:'javascript 2',body: "JavaScript-язык программирования"},
        {id:3,title:'javascript 3',body: "JavaScript-язык программирования"}
    ])
    const  [post,setPost]=useState({title:'',body:''});
    //const bodyInputRef=useRef();
    const  addNewPost=(e)=>{
        e.preventDefault();
        const newPost={
            id: Date.now(),
            title,body
        }
        setPosts([...posts, {...post,id: Date.now()}]);
        setPost();
        console.log(newPost);
        //console.log(title);//управляемый
        //console.log(boduInputRef.current.value);//неуправляемый
    }
  return (
    <div className="App">
        <form>
            <MyInput value={post.title} onChange={e=>setPost(...post, title: e.target.value)} type='text' placeholder='название поста'/>
            <MyInput value={post.body} onChange={e=>setPost(...post, body: e.target.value)} type='text' placeholder='название поста'/>
            <MyButton type="submit" onClick={addNewPost}>Создать пост</MyButton>
        </form>
        <PostList posts={posts} title="Список постов 2"/>
    </div>
  );
}

export default App;

ksa 06.06.2022 22:44

Цитата:

Сообщение от riaron86
setPost(...post, title: e.target.value)

Тут все верно?

И каким боком тут раздел по Node.JS?

riaron86 07.06.2022 12:44

я это пишу с ютубовских уроков
ошибки вроде нет
могу скинуть исходники

Nexus 07.06.2022 15:28

riaron86, тут 2 варианта: либо качество потребляемых вами уроков оставляет желать лучшего, либо вы недостаточно внимательны.
Почитайте про spread operator.


Часовой пояс GMT +3, время: 11:44.