polymer-1.0 - GET 请求后 DOM 上的属性未更改
问题描述
我正在开发一个组件来呈现用户详细信息。从 API 请求中获取详细信息并更新属性,但这些更改不会反映在 DOM 上。
我工作的公司仍在使用 Polymer 1.2,我很难找到和理解文档。我是否需要从父组件发出获取请求,或者是否可以直接在组件内部执行此操作?我没有掌握一些基本的东西,并想知道是否有人可以为我解释一下。
谢谢你。
模板中的片段:
<p>{{i18n.GLOBAL_USERNAME}} - [[username]]</p>
<p>{{i18n.GLOBAL_FIRSTNAME}} - [[firstname]]</p>
<p>{{i18n.GLOBAL_LASTNAME}} - [[lastname]]</p>
<p>{{i18n.GLOBAL_EMAIL}} - [[email]]</p>
<p>{{i18n.GLOBAL_NUMBER}} - [[number]]</p>
聚合物功能的片段:
Polymer({
is: 'my-component',
properties: {
username: {
type: String,
value: "n/a",
},
firstname: {
type: String,
value: "n/a"
},
lastname: {
type: String,
value: "n/a"
},
email: {
type: String,
value: "n/a"
},
number: {
type: String,
value: "n/a"
},
},
ready: function () {
var user = app.auth.hasSession()
if (user !== null) {
app.getUserInfo(user.user_id, this._getUserSuccessful, this._getUserFail);
}
},
_getUserSuccessful: function (res) {
this.username = res.user.user_id
this.firstname = res.user.firstname
this.lastname = res.user.lastname
this.email = res.user.email
this.number = res.user.phone_number
console.log("got user details")
},
_getUserFail: function () {
console.log("failed to get user details")
},
});
解决方案
您需要使用Polymer setter 方法而不是简单的赋值。
这是一个例子:
_getUserSuccessful: function (res) {
this.set('username', res.user.user_id)
this.set('firstname', res.user.firstname)
this.set('lastname', res.user.lastname)
this.set('email', res.user.email)
this.set('number', res.user.number)
console.log("got user details")
},
数据绑定属性需要使用 setter 和/或数组 mutator 方法,否则 Polymer 无法知道某些内容已更改以更新绑定。
我真的建议您在继续使用 Polymer 1.x 进行任何类型的工作之前阅读整个数据系统概念文章。
推荐阅读
- amazon-dynamodb-dax - UnboundLocalError: local variable 'key_schema' referenced before assignment
- java - Spring: Implement a share-via-link feature for web application
- java - 如何在Java中实现注解为@Retention(RetentionPolicy.SOURCE)的注解
- c# - NUnit - 没有找到合适的构造函数
- laravel - 让虚拟机向自己发送邮件
- sql - PostgreSQL 将带时区的日期转换为时间戳
- grails - Quartz grail插件的问题
- asp.net-mvc - Chart.js 我们怎么能有一个不从 0 开始的列
- r - 如何从单词列表中查找 DF 中的匹配单词并在新列中返回匹配的单词
- java - 使用 Spring Data JPA 和 Stream 的休眠查询缓存不起作用