Polymer 1.0 观察阵列
Polymer 1.0 Observe Array
我刚刚尝试将我的 Polymer 网站更新到 1.0 版,但我的数组观察器功能不再起作用。所以我查看了文档并注意到,有一种观察推送和弹出更改的新方法。
为了测试这些更改,我从 Polymer docs 复制了代码,但即使是那个示例也不起作用...这是我测试示例脚本的尝试:
<!doctype html>
<html>
<head>
<title>Test</title>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<script src="/bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="/bower_components/polymer/polymer.html">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<my-index></my-index>
</body>
</html>
<dom-module id="my-index">
<script>
Polymer({
is: "my-index",
properties: {
users: {
type: Array,
value: function() {
return [];
}
}
},
observers: [
'usersAddedOrRemoved(users.splices)'
],
ready: function(){
this.addUser();
},
usersAddedOrRemoved: function(changeRecord) {
console.log(changeRecord);
changeRecord.indexSplices.forEach(function(s) {
s.removed.forEach(function(user) {
console.log(user.name + ' was removed');
});
console.log(s.addedCount + ' users were added');
}, this);
},
addUser: function() {
this.push('users', {name: "Jack Aubrey"});
}
});
</script>
</dom-module>
javascript-控制台只显示 Uncaught TypeError: Cannot read property 'indexSplices' of undefined
。有什么想法吗?
usersAddedOrRemoved 函数在创建 users 数组时触发(使用未定义的 changeRecord)。如果你处理未定义的,你会看到它按预期工作,并在开始时和添加的用户时触发。
usersAddedOrRemoved: function(changeRecord) {
console.log(changeRecord);
if (changeRecord) {
changeRecord.indexSplices.forEach(function(s) {
s.removed.forEach(function(user) {
console.log(user.name + ' was removed');
});
console.log(s.addedCount + ' users were added');
}, this);
}
},
我刚刚尝试将我的 Polymer 网站更新到 1.0 版,但我的数组观察器功能不再起作用。所以我查看了文档并注意到,有一种观察推送和弹出更改的新方法。
为了测试这些更改,我从 Polymer docs 复制了代码,但即使是那个示例也不起作用...这是我测试示例脚本的尝试:
<!doctype html>
<html>
<head>
<title>Test</title>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<script src="/bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="/bower_components/polymer/polymer.html">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<my-index></my-index>
</body>
</html>
<dom-module id="my-index">
<script>
Polymer({
is: "my-index",
properties: {
users: {
type: Array,
value: function() {
return [];
}
}
},
observers: [
'usersAddedOrRemoved(users.splices)'
],
ready: function(){
this.addUser();
},
usersAddedOrRemoved: function(changeRecord) {
console.log(changeRecord);
changeRecord.indexSplices.forEach(function(s) {
s.removed.forEach(function(user) {
console.log(user.name + ' was removed');
});
console.log(s.addedCount + ' users were added');
}, this);
},
addUser: function() {
this.push('users', {name: "Jack Aubrey"});
}
});
</script>
</dom-module>
javascript-控制台只显示 Uncaught TypeError: Cannot read property 'indexSplices' of undefined
。有什么想法吗?
usersAddedOrRemoved 函数在创建 users 数组时触发(使用未定义的 changeRecord)。如果你处理未定义的,你会看到它按预期工作,并在开始时和添加的用户时触发。
usersAddedOrRemoved: function(changeRecord) {
console.log(changeRecord);
if (changeRecord) {
changeRecord.indexSplices.forEach(function(s) {
s.removed.forEach(function(user) {
console.log(user.name + ' was removed');
});
console.log(s.addedCount + ' users were added');
}, this);
}
},