qml属性绑定问题
最近项目中遇到qml属性绑定相关的两个问题：
- 改变object对象的属性，qml绑定的相关属性没有改变
- 改变绑定属性，导致绑定关系被打断
上面两个问题说的有点不清楚，接下来看代码详解
Window {
id:mainWnd
visible: true
width: 640
height: 480
title: qsTr("Hello World")
property var robotInfo:{"name":"robot1","light_state":1}
property bool lightOn: robotInfo.light_state === 1
Row{
anchors.centerIn: parent
spacing: 10
Text {
text: lightOn?qsTr("灯光已经打开"):qsTr("灯光已经关闭")
}
Button{
text: qsTr("开关")
onClicked: {
robotInfo.light_state === 1 ?robotInfo.light_state = 0:robotInfo.light_state = 1
console.log("robotInfo.light_state :",robotInfo.light_state)
}
}
}
}
问题一：
1.属性对象robotinfo是一个json 对象
2.lightOn属性绑定了robotinfo 的字段属性light_state值
3.onClicked事件中改变light_state的值，但是lightOn没有跟着改变
原因：这是因为robotinfo对象本身没有变，只是其中的某个属性改变，属性绑定不会重新评估。只有外层的整个object改变时才会重新评估。
既然知道了原因，我想到的解决方法就是，每改变一个属性，都改变object。保证所有相关的属性绑定都重新评估。其实也就是重新赋值的过程。
function update(){
var obj = {};
Object.assign(obj,robotInfo)
robotInfo = obj
}
Button{
text: qsTr("开关")
onClicked: {
robotInfo.light_state === 1 ?robotInfo.light_state = 0:robotInfo.light_state = 1
console.log("robotInfo.light_state :",robotInfo.light_state)
mainWnd.update()
}
}
问题二：
1.认为改变lightOn的值
2.再改变robotInfo.light_state，lightOn再也无法跟着变化
先点击开关2，再点击开关按钮，无论robotInfo.light_state怎么变，lightOn都没变化了。
代码如下：
Window {
id:mainWnd
visible: true
width: 640
height: 480
title: qsTr("Hello World")
property var robotInfo:{"name":"robot1","light_state":1}
property bool lightOn: robotInfo.light_state === 1
Row{
anchors.centerIn: parent
spacing: 10
Text {
text: lightOn?qsTr("灯光已经打开"):qsTr("灯光已经关闭")
}
Button{
text: qsTr("开关")
onClicked: {
robotInfo.light_state === 1 ?robotInfo.light_state = 0:robotInfo.light_state = 1
console.log("robotInfo.light_state :",robotInfo.light_state)
mainWnd.update()
}
}
Button{
text: qsTr("开关2")
onClicked: {
lightOn = !lightOn
}
}
}
function update(){
var obj = {};
Object.assign(obj,robotInfo)
robotInfo = obj
}
}
原因：认为改变属性lightOn的值之后，会打断属性绑定，即再改变robotInfo.light_state，也无法体现绑定关系了。
解决方法：只能用第一个问题的解决方案，既然做了属性绑定，就不要自行改变属性的值，而是通过改变相关绑定的属性。一如本例，只能通过直接改变robotInfo.light_state。