все работает, но в базу не заносится

вы все что ли начали на ноде писать))

реакт нода

вот вы смешные)

не верно запрос пишешь полагаю

я думал завернуть axios в функцию и вызывать ее при нажатии на кнопку, но не выходит

fetch('http://localhost:4000/business/add',{ method: 'post', body: { name:this.props.name, message:this.props.message } }).then(response =>this.props.addMessage(response.data) попробуй

а в ноде принемай данные с res.body

app.post('/business/add', (res, req) => { ..... })

как то так наверно у тебя

дело в том, что когда у меня axios был в функциональной компоненте все работало

componentDidMount() { axios.post('http://localhost:4000/business/add',{ name:this.props.name, message:this.props.message }).then(response =>this.props.addMessage(response.data) ) }

а эта работает?

да

onAddMessage=()=>{ axios.post('http://localhost:4000/business/add',{ name:this.props.name, message:this.props.message }).then(response =>this.props.addMessage(response.data)) } componentDidMount() { this.onAddMessage() } <button onClick={()=>{this.componentDidMount()}}>Send</button>

let onAddMessage=()=>{ axios.post('http://localhost:4000/business/add',{ name:props.name, message:props.message }).then(response =>props.addMessage(response.data) ) }

подобная конструкция должна быть

то есть отдельный метод который делает запросы

и при клике его вызываешь

попробую

ой стой

<button onClick={()=>{this.onAddMessage()}}>Send</button>

ошибка нельзя вызывать componentDidMount

выдает ошибку props.onAddMessage is not a function

почему пропс?

this.onaddmessage или props.addmessage

у меня там функциональная компонента

я выношу axios

в контейнер

Пробуй называть функции разнообразней, у тебя возможно путанница в названиях где что вызываешь.

если у тебя класс то у тебя нет такого ка кпрост

надо зис пропс

я же перекинул его

<Input updateNewPostText={this.props.updateNewPostText} updateNewNameText={this.props.updateNewNameText} addMessage={this.props.addMessage} name={this.props.name} message={this.props.message} onAddMessage={this.props.onAddMessage}/>

так ты лучше скрины скить эти файлов где у тебя работа налажена

import React from 'react'; import {connect} from 'react-redux'; import {updateNewPostTextActionCreator,addMessageActionCreator, updateNewNameTextActionCreator} from '../../redux/messageReduser' import Input from './Input'; import {updadeDataActionCreator} from '../../redux/messageReduser' import * as axios from "axios"; class InputContainer extends React.Component{ constructor(props){ super(props) } componentDidMount() { this.onAddMessage=()=>{ axios.post('http://localhost:4000/business/add',{ name:this.props.name, message:this.props.message }).then(response =>this.props.addMessage(response.data)) } } render() { return ( <Input updateNewPostText={this.props.updateNewPostText} updateNewNameText={this.props.updateNewNameText} addMessage={this.props.addMessage} name={this.props.name} message={this.props.message} onAddMessage={this.props.onAddMessage}/> ) } } const mapStateToProps = (state) => { return { name: state.messagesPage.name, message: state.messagesPage.message, } } const mapDispatchToProps = (dispatch) => { return { addMessage:(messages)=>{ dispatch(addMessageActionCreator(messages)); }, updateNewPostText:(post)=>{ let action=updateNewPostTextActionCreator(post); dispatch(action); }, updateNewNameText:(text)=>{ let action=updateNewNameTextActionCreator(text); dispatch(action); } } } export default connect(mapStateToProps, mapDispatchToProps)(InputContainer);

вот контейнер

что это componentDidMount() { this.onAddMessage=()=>{ axios.post('http://localhost:4000/business/add',{ name:this.props.name, message:this.props.message }).then(response =>this.props.addMessage(response.data)) } }

import React from 'react'; import i from './Input.module.css'; import * as axios from "axios"; let Input =(props)=>{ let newNameElement=React.createRef(); let newMessageElement=React.createRef(); let onNameChange=()=> { let text = newNameElement.current.value; props.updateNewNameText(text); } let onMessageChange=()=> { let post = newMessageElement.current.value; props.updateNewPostText(post); } return( <div className={i.Input}> <input type={i.text} onChange={onNameChange} ref={newNameElement} placeholder={props.name} /> <input type={i.text} onChange={onMessageChange} ref={newMessageElement} placeholder={props.message} /> <button onClick={()=>{props.onAddMessage()}}>Send</button> </div> ) } export default Input

😕

вот функциональная

Косяк

Обявляешь функцию в ComponentDidMount

я сейчас только поправил

Вынеси обявление функции в тело класса, и вызывай её в компонентДидМоунт

Ут

до этого не работало

addMessage={this.props.addMessage}

зачем ты её передаёшь? она делает у тебя запрос?

componentDidMount() { this.onAddMessage=()=>{ axios.post('http://localhost:4000/business/add',{ name:this.props.name, message:this.props.message }).then(response =>this.props.addMessage(response.data)) }

это диспатч

Ты Объявляешь её внутри а не вызываешь

ты мне скажи у тебя что сейчас выводит ?

у меня просто заносит в локальный стейт

и мне интересно откуда у тебя метода в контейнере

const mapStateToProps = (state) => { return { name: state.messagesPage.name, message: state.messagesPage.message, } }

тоесть axios не заносит данные

ты же только два поля взял с сторе

как ты остальное передаёшь?

а не стой

ну я их и меняю

сам не заметил

class InputContainer extends React.Component{ constructor(props){ super(props) } componentDidMount() { this.onAddMessage=()=>{ axios.post('http://localhost:4000/business/add',{ name:this.props.name, message:this.props.message }).then(response =>this.props.addMessage(response.data)) } } render() { return ( <Input updateNewPostText={this.props.updateNewPostText} updateNewNameText={this.props.updateNewNameText} addMessage={this.props.addMessage} name={this.props.name} message={this.props.message} onAddMessage={this.props.onAddMessage}/> ) } }

Где ты объявляешь метод onAddMessage?

Объявление надо вынести в тело класса

смори

я вынес

Что ты передаешь в Инпут?

в инпут ты передаёшь addMessage={this.props.addMessage}

this.PROPS.onAddMessage

а вызываешь {props.onAddMessage()}}

Где в пропсах класса onAddMessage - его там нет т.к. он метод класса а не пропса

onAddMessage у тебя делает запрос

addMessage как я понял сохраняет в стейт

попробуй вызывать addMessage

или так и задуманно при клике делать запрос?<button onClick={()=>{props.onAddMessage()}}>Send</button>

c addMessage сообщения выводятся но не заносятся в базу

сейчас по другому

ты же зачем то передал его в инпут addMessage

Да по клику он должен сделать запрос, потом сохранить. Он просто вместо this.onAddMessage написал this.props.onAddMessage

f tuj ytn d ghjgcf[