在 Polymer 中声明自定义元素的私有 属性 的最佳做法是什么
What is the best practices with declaring custom element's private property in Polymer
通过查看 Polymer 开发指南,属性对象中声明的属性将成为元素的 public API。所以我通常不会在属性对象中声明私有属性,而是
ready: function() {
this.privatePropertyName = 'random text';
}
我还看到一些代码在使用“_”前缀命名约定的属性中声明私有属性,例如
properties: {
_privateProperty: {
type: Number,
readOnly: true,
value: 0,
}
}
这方面的最佳做法是什么?我们是否应尝试坚持只有 public 个属性进入属性对象的规则?
如果您查看 code developed by Polymer team,他们遵循的做法是在 属性 对象内声明所有属性。他们使用 _
将私有属性与 public 分开。
<link rel="import" href="https://polygit.org/components/polymer/polymer.html">
<dom-module id="has-private">
<template>{{newProp}}</template>
</dom-module>
<script>
Polymer({
is: 'has-private',
properties: {
_private: 'privateMember',
inSide: {
type: String,
value: 'ousidePropertiesObject',
reflectToAttribute: true,
observer: '_insideChanged'
}
},
outSide: {
type: String,
value: 'ousidePropertiesObject',
reflectToAttribute: true,
observer: '_changed'
},
_changed: function(newVal) {
alert("New value if outSide is: " + newVal);
},
_insideChanged: function(newVal) {
alert("New value if inSide is: " + newVal);
},
attached: function() {
console.log("value of outSide", this.outSide);
alert("From internal element \n outside: " + this.outSide + " inside: " + this.inSide);
alert("New Prop: " + this.newProp);
this.undeclaredProperty = "i'm not declared anywhere in the code";
}
})
</script>
<dom-module id="access-private">
<template>
<has-private id="private" out-side="doesn't matter" in-side="doesn't matter" new-prop="hello"></has-private>
</template>
</dom-module>
<script>
Polymer({
is: 'access-private',
attached: function() {
this.$.private.outSide = "i work";
this.$.private.inSide = "i work";
alert("value of has-private element's private property in access private is: " + this.$.private._private);
alert("value of property outside properties object is: " + this.$.private.outSide);
alert("value of undeclared property is: " + this.$.private.undeclaredProperty);
}
})
</script>
<access-private>
</access-private
这里有一些关于属性的提示。
- 没有必要声明一个 public
properties
对象。
- 未在属性对象中声明的属性仍然可以是public属性即可以被其他元素访问
- 类似地,您可以在标记中提及尚未在属性对象中声明的属性,然后在内部元素的标记或javascript(布尔值除外)中使用它。
- 在属性对象中声明的一个优点是可以更轻松地跟踪所有属性。
- 它也可能对属性对象中声明的属性发生的反序列化产生一些影响。
Adding a property to the properties object allows a user to configure the property from markup (see attribute deserialization for details). Any property that's part of your element's public API should be declared in the properties object.
如您所见,Polymer 文档说 属性 应该 在 properties
对象内声明,而不是 必须 或 需要 这意味着 强烈推荐 而不是 强制性
通过查看 Polymer 开发指南,属性对象中声明的属性将成为元素的 public API。所以我通常不会在属性对象中声明私有属性,而是
ready: function() {
this.privatePropertyName = 'random text';
}
我还看到一些代码在使用“_”前缀命名约定的属性中声明私有属性,例如
properties: {
_privateProperty: {
type: Number,
readOnly: true,
value: 0,
}
}
这方面的最佳做法是什么?我们是否应尝试坚持只有 public 个属性进入属性对象的规则?
如果您查看 code developed by Polymer team,他们遵循的做法是在 属性 对象内声明所有属性。他们使用 _
将私有属性与 public 分开。
<link rel="import" href="https://polygit.org/components/polymer/polymer.html">
<dom-module id="has-private">
<template>{{newProp}}</template>
</dom-module>
<script>
Polymer({
is: 'has-private',
properties: {
_private: 'privateMember',
inSide: {
type: String,
value: 'ousidePropertiesObject',
reflectToAttribute: true,
observer: '_insideChanged'
}
},
outSide: {
type: String,
value: 'ousidePropertiesObject',
reflectToAttribute: true,
observer: '_changed'
},
_changed: function(newVal) {
alert("New value if outSide is: " + newVal);
},
_insideChanged: function(newVal) {
alert("New value if inSide is: " + newVal);
},
attached: function() {
console.log("value of outSide", this.outSide);
alert("From internal element \n outside: " + this.outSide + " inside: " + this.inSide);
alert("New Prop: " + this.newProp);
this.undeclaredProperty = "i'm not declared anywhere in the code";
}
})
</script>
<dom-module id="access-private">
<template>
<has-private id="private" out-side="doesn't matter" in-side="doesn't matter" new-prop="hello"></has-private>
</template>
</dom-module>
<script>
Polymer({
is: 'access-private',
attached: function() {
this.$.private.outSide = "i work";
this.$.private.inSide = "i work";
alert("value of has-private element's private property in access private is: " + this.$.private._private);
alert("value of property outside properties object is: " + this.$.private.outSide);
alert("value of undeclared property is: " + this.$.private.undeclaredProperty);
}
})
</script>
<access-private>
</access-private
这里有一些关于属性的提示。
- 没有必要声明一个 public
properties
对象。 - 未在属性对象中声明的属性仍然可以是public属性即可以被其他元素访问
- 类似地,您可以在标记中提及尚未在属性对象中声明的属性,然后在内部元素的标记或javascript(布尔值除外)中使用它。
- 在属性对象中声明的一个优点是可以更轻松地跟踪所有属性。
- 它也可能对属性对象中声明的属性发生的反序列化产生一些影响。
Adding a property to the properties object allows a user to configure the property from markup (see attribute deserialization for details). Any property that's part of your element's public API should be declared in the properties object.
如您所见,Polymer 文档说 属性 应该 在 properties
对象内声明,而不是 必须 或 需要 这意味着 强烈推荐 而不是 强制性