Trung tâm cá nhân
sách gpt4 ai đã đi

javascript - 如何在React Material-UI组件中调用方法

In lại 作者：行者123 更新时间：2023-12-02 14:57:36 27 4
mua khóa gpt4 Nike

我正在实现一个具有添加表情符号功能的聊天系统。为此，我创建了一个函数，它返回一个组件以及文本和图像。

我使用的功能

 test: function(item1) {
    var texts = item1.message.split(/:\)/g);
    console.log(texts);
    var content = [];
    for(var i = 0; i < texts.length - 1; i++) {
        content.push(texts[i]);
      content.push();
    }
    return content.map(function(emoji) {
      return ( {emoji} )
    })
  },

对于这次聊天，我使用的是 socketio 和 Node Express。返回的消息显示在 react 组件上。 “线程”jason 包含所有收到的消息(线程内的键是 message,user1)。现在我想要的是在 secondaryText 中调用上述测试函数并传递 {item.message} 作为参数。但当它运行时，它会显示“ Uncaught ReferenceError :测试未定义”。 

  

      {

        this.state.threads.map(function(item) {

            return (<>
                leftAvatar={}
                primaryText={item.user1}
                secondaryText={test({item})}
                secondaryTextLines={2}
            />
            );

        })
      }

整个 react 组件

    const Threads = React.createClass({

  getInitialState: function() {
    trở lại {
        threads: ThreadStore.getmessages()
    }
  },

  userlistio:function(){
      console.log(" awooooo");
    socket.on('chatList',function(data){
        console.log(data.Userlist+" awa!");
    }.bind(this));
 },

    componentDidMount: function () {
        ThreadStore.addChangeListener(this._onChange);

    },
    _onChange: function () {
        this.setState({
            threads: ThreadStore.getmessages()
        });

    },
  socketio: function() {

    socket.on('chat', function (data) {
      console.log(data.message);
        console.log(data.user2);
      this.setState({threads: data.message});
    }.bind(this));
  },
  _sendmessage: function() {
      let message = this.refs.message2.value;
      let User2 = this.refs.message1.value;
      let Eml = LoginStore.getEmail();
    let chat = {
        message: message,
        user1: User1,
        user2: User2,
        emailusr1: Eml
    }
    console.log('Emiting ...');
    socket.emit('message', chat);
    console.log('Done ...');

  },
  test: function(item1) {
    var item = {
        message: ':) hello :) hello :) hello :)'
    }
    console.log("smilies working");
    var texts = item1.message.split(/:\)/g);
    console.log(texts);
    var content = [];
    for(var i = 0; i < texts.length - 1; i++) {
        content.push(texts[i]);
      content.push();
    }
    return content.map(function(emoji) {
      return ( {emoji} )
    })
  },
  render: function() {
    trở lại (
      
        {this.userlistio()}
        {this.socketio()}
        
        
          Message threads
            

          {

            this.state.threads.map(function(item) {

                return (<>
                    leftAvatar={}
                    primaryText={item.user1}
                    secondaryText={test({item})}
                    secondaryTextLines={2}
                />
                );

            })
          }
            

            
                
                
          
            



        
        

        
        
    );
  }

});

1 Câu trả lời

将 this.state.threads.map 更改为:

    //es6
    this.state.threads.map(item => { //use arrow functions in es6 for this binding/readability
        trở lại (
          <>
            leftAvatar={}
            primaryText={item.user1}
            secondaryText={this.test(item)} //changed item here to be the item as opposed to a new object of { item: item } as in your previous code.
            secondaryTextLines={2}
          />
      );
    })

    //es5
    this.state.threads.map(function(item) { //use arrow functions in es6 for this binding/readability
        trở lại (
          <>
            leftAvatar={}
            primaryText={item.user1}
            secondaryText={this.test(item)} //changed item here to be the item as opposed to a new object of { item: item } as in your previous code.
            secondaryTextLines={2}
          />
      );
    }.bind(this))

关于javascript - 如何在React Material-UI组件中调用方法，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35665545/

27 4 0
Bài viết được đề xuất: javascript - Jscroll立即加载所有页面
Bài viết được đề xuất: ftp - Solaris 10 上 ftp rstatus 的等效 ftp 命令？
Bài viết được đề xuất: asp.net - 在 ASP.Net 上每个 Web 请求创建 dbcontext 的成本
Bài viết được đề xuất: javascript - Angular ng-repeat 变量可访问另一个作用域对象
行者123
Hồ sơ cá nhân

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá Didi Taxi miễn phí
Mã giảm giá Didi Taxi
Các bài viết nóng hổi trên toàn bộ trang web
Giấy chứng nhận ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com