1

onChannelSelect function is called whenever component is rendered so channelUrl variable is reset.Because of that channel url is not changed when we click on any channel.Every time first channel's url was set from channel list.So how can i set channel url using setState method ??

import { ChannelList, SendBirdProvider, Channel } from "sendbird-uikit";

 setChannelUrl = (channel) => {
        console.log("channel", channel.url)
        this.setState({ channelUrl: channel.url })

    }
<div className="container cart">
                        <SendBirdProvider appId={global.chat.sendbirdAppId}
                            userId={profile.sendbird_id} >
                            <div className="card card-aspenku">
                                <div className="row">
                                    <div className="col-md-4" style={{ height: '400px' }} >
                                        <ChannelList
                                            onChannelSelect={(channel) => {
                                                if (this.state.channelUrl === "" || 
                                                    this.state.channelUrl !== channel.url) 
                                                {
                                                    console.log("channel")
                                                    this.setChannelUrl(channel)
                                                }
                                                else {
                                                    console.log("no channel")
                                                }
                                            }}
                                            queries={{
                                                channelListQuery: {
                                                    includeEmpty: true,
                                                },
                                                applicationUserListQuery: {
                                                    limit: 30,
                                                    userIdsFilter: [profile.sendbird_id],
                                                }
                                            }}
                                        />
                                    </div>
                                    <div className="col-md-8" style={{ height: '400px' }}>
                                        {this.state.channelUrl && <Channel
                                            channelUrl={this.state.channelUrl}
                                            queries={{
                                                messageListParams: {
                                                    senderUserIds: [profile.sendbird_id],
                                                    prevResultSize: 10,
                                                    includeParentMessageText: true,
                                                    includeReaction: true,
                                                }
                                            }}

                                        />}
                                    </div>
                                </div>
                            </div>
                        </SendBirdProvider>
                    </div>
Hetal Sodavadiya
  • 73
  • 4
  • It seems that "this.state.channelUrl.channelUrl === "" || this.state.channelUrl.channelUrl !== channel.url " condition goes wrong every time because state value is stored in this state : this state.channelUrl , Not in this state : this state.channelUrl.channelUrl. Can you verify it first ? – Mayur Kukadiya Sep 03 '20 at 16:52
  • 1
    It was typing mistake.Thanks @mayurkukadiya for inform me about that mistake. – Hetal Sodavadiya Sep 04 '20 at 04:00
  • You should remove condition first and try to call "this.setState({ channelUrl: channel.url })" inside onChannelSelect() instead of calling function. and log that channel.url on click..(this changes should done for debug purpose only) So I can Identify that clicked url is correct or not !!!. confirm that channel url is not same in all channel according to channelList.... – Mayur Kukadiya Sep 04 '20 at 11:07
  • @mayurkukadiya , "this.setState" directly not working in render.If i will set then it will be go in infinite loop. – Hetal Sodavadiya Sep 08 '20 at 04:09

0 Answers0