聚合物1当修改行为中对象的一个​​属性时,不会触发观察者

时间:2018-05-30 08:45:18

标签: polymer polymer-1.0

当selectedWidget.id值更改时,观察者未检测到更改。

这位观察员:

观察者:['functionOberveId(selectedWidget.id)'],

代码hola-mundo.html是:

<link rel="import" href="./bower_components/polymer/polymer.html">
<link rel="import" href="./hidding-behaviour.html">
<dom-module id="hola-mundo">
	<style>
		h1{
			color: blue;
		}
	</style>
	<template>
		<h1>hello world</h1>
		<button on-click="changeValuebahviourId">changeValuebahviourId</button>
		<button on-click="showValuebehaviourId">showValuebahviourId</button>
		
	</template>

	<script>
		Polymer({
			is: "hola-mundo",
			behaviors: [Hidding],
			observers: ['functionOberveId(selectedWidget.id)'],
			
			
			functionOberveId: function(){
				console.log("the observer is working fine")
				console.log("the id value in behaviour is: " + this.selectedWidget.id)
			},
			
			changeValuebahviourId: function(){
				this.selectedWidget.id= (this.selectedWidget.id +1)
			},	
			showValuebehaviourId: function(){
				console.log("the id value in behaviour is: " + this.selectedWidget.id)
			},	
		});
	</script>
</dom-module>

代码hidding-behaviour.html是:

<script>
    Hidding = {        
        properties:{
            selectedWidget: {
                type: Object,
                value: {
                    item: null,
                    id: 0,
                },
            },
        },
        
    }
</script>

index.html代码是:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Prueba de index</title>
	<script src="./bower_components/webcomponentsjs/webcomponents.js"></script>
	<link rel="import" href="./hola-mundo.html">
</header>
<body>

	<hola-mundo></hola-mundo>
</body>
</html>

当我们按下“changeValuebahviourId”按钮时,为什么观察者没有被射击?

我很感激这方面的帮助我已经查了很久了,我找不到解决办法。

非常感谢。

1 个答案:

答案 0 :(得分:1)

聚合物需要知道发生了一些变化,因此无法调用

this.selectedWidget.id= (this.selectedWidget.id +1)

使用此:

this.set('selectedWidget.id', this.selectedWidget.id +1);

Documentation polymer