C#8, .NET 5, DevSecOps, Azure Functions та мікросервіси на конференції .NET fwdays | Online

Что не так с вызовом компонентов в Реакте?

Есть некий класс

import React, { Component } from 'react';
import io from "socket.io-client";

class Chat extends React.Component{

socket = io('localhost:5000');

// socketListening создаеться как обьект
socketListening = this.socket.on('RECEIVE_MESSAGE', function(data){
console.log(Chat) });

info(){console.log(this)

render(){return ();}}

По Итогу что мы имеемиз вызова

socketListening = this.socket.on( console.log(this ) );

мы имеем прямую ссылку на обьект

Chat {props: {…}, context: {…}, refs: {…}, updater: {…}, state: {…}, …}
addMessage: data => {…}
context: {}
props: {name: "Noname", dispatch: ƒ}
refs: {}
sendMessage: ev => {…}
socket: Socket {io: Manager, nsp: "/", json: Socket, ids: 0, acks: {…}, …}
socketListening: Socket {io: Manager, nsp: "/", json: Socket, ids: 0, acks: {…}, …}
state: {username: "", message: "", messages: Array(0)}
..... и т.д.

а при вызове из другого объекта

 socketListening = this.socket.on(
'RECEIVE_MESSAGE', function(data){ console.log(Chat) });

мы получаем обычное сообщение (без ссылки на объект)

class Chat extends react__WEBPACK_IMPORTED_MODULE_0___default.a.Component {
constructor(...args) {
super(...args);
this.state = {
username: '',
message: '',
messages: []
};

вопрос: что это во втором варианте и как правильно обращаться к компонентам(а точнее их свойствам) из дочерних компонентов или прочих мест?????

LinkedIn
Допустимые теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Допустимые теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
receiveMessageCallback = (data) => console.log(this);

socketListening = this.socket.on(
’RECEIVE_MESSAGE’, this.receiveMessageCallback);

Подписаться на комментарии