Javascript 如何从另一个组件n ember.js调用组件中的函数？

单击“编辑”按钮后，我处于打印用户组件中。我正在重定向编辑用户组件。 我必须将数据从打印用户发送到编辑用户。 因此，我从打印用户组件类调用编辑用户组件类函数。 但它显示了错误

app/components/print-user.hbs

</input5>
    <table class="styled-table">
        <thead>
            <tr><th>User Id</th>
                <th>Firstname</th>
                <th>Lastname</th>
                <th>Mailid</th>
                <th>Delete</th>
            </tr>
        </thead>
        {{#each this.dummyresponse.Users_data as |user|}}
            <tbody>
                <tr>
                    <td>{{user.id}}</td>
                    <td>{{user.firstname}}</td>
                    <td>{{user.lastname}}</td>
                    <td>{{user.mailid}}</td>
                    <LinkTo @route="edit-user" ><button {{on "click" (fn edituser user.id user.firstname user.lastname user.mailid )}} >Edit</button>r</LinkTo></td>
                </tr>
            </tbody>
        {{/each}}
    </table>
{{yield}}

import Component from '@glimmer/component';

export default class EditUserComponent extends Component {

    async edituser (id,firstname,lastname,mailid){
        alert("edit-user.js entered");
        let response=await fetch("/UserManagement/UserManagementServlet",
        {   method: "POST",
            body: JSON.stringify({
                "type": "edit",
                "id": id,
                "firstname":firstname,
                "lastname":lastname,
                "mailid":mailid
            })
        });
    }
}

import Component from '@glimmer/component';

export default class EditUserComponent extends Component {

    async edituser (id,firstname,lastname,mailid){
        alert("edit-user.js entered");
        let response=await fetch("/UserManagement/UserManagementServlet",
        {   method: "POST",
            body: JSON.stringify({
                "type": "edit",
                "id": id,
                "firstname":firstname,
                "lastname":lastname,
                "mailid":mailid
            })
        });
    }
}

app/components/edit-user.hbs

</input5>
    <table class="styled-table">
        <thead>
            <tr><th>User Id</th>
                <th>Firstname</th>
                <th>Lastname</th>
                <th>Mailid</th>
                <th>Delete</th>
            </tr>
        </thead>
        {{#each this.dummyresponse.Users_data as |user|}}
            <tbody>
                <tr>
                    <td>{{user.id}}</td>
                    <td>{{user.firstname}}</td>
                    <td>{{user.lastname}}</td>
                    <td>{{user.mailid}}</td>
                    <LinkTo @route="edit-user" ><button {{on "click" (fn edituser user.id user.firstname user.lastname user.mailid )}} >Edit</button>r</LinkTo></td>
                </tr>
            </tbody>
        {{/each}}
    </table>
{{yield}}

import Component from '@glimmer/component';

export default class EditUserComponent extends Component {

    async edituser (id,firstname,lastname,mailid){
        alert("edit-user.js entered");
        let response=await fetch("/UserManagement/UserManagementServlet",
        {   method: "POST",
            body: JSON.stringify({
                "type": "edit",
                "id": id,
                "firstname":firstname,
                "lastname":lastname,
                "mailid":mailid
            })
        });
    }
}

import Component from '@glimmer/component';

export default class EditUserComponent extends Component {

    async edituser (id,firstname,lastname,mailid){
        alert("edit-user.js entered");
        let response=await fetch("/UserManagement/UserManagementServlet",
        {   method: "POST",
            body: JSON.stringify({
                "type": "edit",
                "id": id,
                "firstname":firstname,
                "lastname":lastname,
                "mailid":mailid
            })
        });
    }
}

app/components/edit-user.js

Uncaught TypeError:\u editUser.default.editUser不是函数
在Proxy.edituser（print user.js:88）
代理。（runtime.js:7105）

您试图使用

EditUserComponent

的

edituser

方法作为

edituser

的

PrintUserComponent

方法中的静态方法。简化后的代码如下所示：

import EditUserComponent from./edit user'；
log（EditUserComponent.edituser（id，firstname，lastname，mailid））；

您不是在类的实例上调用

edituser

方法，而是在类本身上调用。也许你正在寻找一个好的旧的实用功能，而不是

//app/utils/edituser.js
异步函数edituser（id、firstname、lastname、mailid）{
警报（“edit-user.js已输入”）；
let response=wait fetch（“/UserManagement/UserManagementServlet”，
{方法：“张贴”，
正文：JSON.stringify({
“类型”：“编辑”，
“id”：id，
“名字”：名字，
“lastname”：lastname，
“mailid”：mailid
})
});
}
导出默认编辑用户；

该实用程序功能可以这样使用：

从“../utils/edituser”导入edituser；
log（edituser（id，firstname，lastname，mailid））；

---

组件只能在模板中调用。因此，它们肯定不是您想要的。

请在出现错误的地方发布您所需的代码。您是否在app/router.js中为edituser组件添加了路由？是的，如果我在print-user.hbs中按edit，我在route.js中为edit user添加了路由。它将重定向到edit-user.hbs。我必须使用打印用户的mailid更新用户在edit-user.hbs中提供的数据，例如：Userid Fname Lname mailid 1 Hari Dosshari@gmail.com编辑如果我在此处按Edit，它将重定向到Edit-user.hbs并要求我输入要修改的数据。如果用户提供了Userid Fname Lname mailid 1 Doss Harihari@gmail.com根据print-user.hbs中的mailid，我必须更新数据库中的数据。有没有办法做到这一点