Question

我试图让一个JavaScript函数根据我的函数返回给定用户ID的用户名。我今晚遇到了一些非常奇怪的事情-我的ReactJS.NET脚本崩溃了，仅在此特定功能上神秘地崩溃了（尽管我可以在我的React脚本的许多其他部分中放置Javascript警报，但是在没有抛出相同错误的情况下，并不是所有这些都可以）。

起初，我认为这可能是一个绑定问题-上一次，当我尝试在另一个JSX脚本中绑定一个类似的函数时，我发现发生了这种情况，因为我在父React组件的构造函数中声明了该函数函数名称的拼写有误，到处都是。

现在，我无法找出与该问题真正发生的事情相近的事情。当我尝试读取传入的值或尝试在内部调用Javascript警报时，以下功能尤其崩溃：

getUsername(UserId) {
        if (!UserId) {
            return;
        }
        else {
            var stringCheck = String(Object.values(UserId));
            if (this.usersCollection.data.find(item => item.userId === stringCheck)) {
                var idx = this.usersCollection.data.findIndex(item => String(item.userId) == stringCheck);
                return this.usersCollection.data[idx].userName;
            }
            else {
                return "Nobody...";
            }
        }
    }

我似乎在父组件的构造函数中正确地绑定了它，所以我不确定发生了什么

class Queue extends React.Component {
    constructor(props) {
        super(props);
        this.state = { data: this.props.initialData, closedData: this.props.closedData, selectedData: this.props.initialData };
        this.handleTicketSubmit = this.handleTicketSubmit.bind(this);
        this.toJavaScriptDate = this.toJavaScriptDate.bind(this);
        this.userState = { data: this.props.userData };
        this.usersCollection = { data: this.props.userDB };
        this.getUsername = this.getUsername.bind(this);
        this.serverMsg = { data: this.props.serverMsg };
        this.srvMsgRst = { data: this.props.srvMsgRst };
        this.showAllTickets = this.showAllTickets.bind(this);
        this.showMyTickets = this.showMyTickets.bind(this);
        this.checkServerMessage = this.checkServerMessage.bind(this);
    }

这是将getUsername函数从中传递到我的TicketList组件的呈现函数：

render() {
        var anyClosedItems = this.state.closedData;
        return (
            <div className="queue">
                <button class="btn btn-info active" id="allTix" onClick={this.showAllTickets}>All Tasks</button>
                <button class="btn btn-info" id="myTix" onClick={this.showMyTickets}>My Tasks</button>
                <h1>Affirm Queue</h1>



                <TicketList data={this.state.selectedData} getTicket={this.props.navUrl} renderDate={this.toJavaScriptDate} checkUser={this.getUsername} />
                <div id="noTixNotice" style={{display: 'none'}}><h3>There are no open tasks.</h3></div>
                <hr/>
                <h1>Closed Items</h1>
                {anyClosedItems.length == 0 ? <div><h3>There are currently no closed items today.</h3></div> : <TicketList data={this.state.closedData} getTicket={this.props.navUrl} renderDate={this.toJavaScriptDate} checkUser={this.getUsername} />}
            </div>
        );
    }

最后，这是ticketList组件本身：

class TicketList extends React.Component {
    render() {
        const ticketNodes = this.props.data.map(ticket => (
            <TicketRow key={ticket.id} ticketLoad={this.props.getTicket+"/"+ticket.id}>

                <td>{ticket.summary}</td> <td> {ticket.description}</td><td>{this.props.renderDate({ value: ticket.currentApptTime })}</td><td>{this.props.checkUser({ UserId: ticket.userOwnerId })}</td>

            </TicketRow>
        ));
        const ticketRaw = this.props.data.map(ticket => (
            <tr>
                <td>{ticket.summary}</td><td>{ticket.description}</td><td>{this.props.renderDate({ value: ticket.currentApptTime })}</td><td>{ticket.userOwnerId}</td>
                </tr>
        ));
        return (
            <div className="ticketList">

                <table id="affirmTable" className="table table-bordered table-hover table-striped">
                    <thead>
                        <tr>
                            <th>Summary</th><th>Description</th><th>Appt Time</th><th>Owner</th>
                            </tr>
                        </thead>
                    <tbody>
                        {ticketNodes}
                        </tbody>
                </table>
            </div>
        );
    }
}

出于某些奇怪的原因，我仍然认为这可能是JavaScript函数的问题，因为一旦我注释了getUsername内的所有内容，就可以了，但是当我尝试使用任何代码（例如JavaScript警报）加载页面时，页面将崩溃并显示“未定义”消息：

TypeError: Cannot read property 'find' of undefined

有人可以让我知道这里会发生什么吗？我很沮丧。

警报未定义，“ findUser”变量未定义

0 个答案: