本文最后更新于 315 天前,其中的信息可能已经有所发展或是发生改变。
暴露数组类型变量
一般为了让QML使用到C++中的变量会使用Q_PROPERTY关键字,Q_PROPERTY可以支持QT各种数组类型,比如QVector、QList等,如:
Q_PROPERTY(QVector<bool> myVec READ myVec WRITE setMyVec NOTIFY myVecChanged FINAL);
//其他相关函数、变量、信号的写法同普通变量
QVector<bool> m_myVec;
Q_SIGNALS: void myVecChanged();
QVector<bool> myVec() const {return m_myVec;}
void setMyVec(QVector<bool> v){
if(m_myVec != v){
m_myVec = v;
Q_EMIT myVecChanged();
}
}
可以直接这样使用,也可以使用关键字QQmlListProperty
修饰(个人认为比较麻烦)
注意:
一般修改暴露的变量都是setMyVec(v);
如果只修改数组中的一个值,可以
使用定义的方法
auto v = myVec(); v[1] = false; setMyVec(v);
修改变量,主动触发信号
m_myVec[1] = false; Q_EMIT myVecChanged();
重载setMyVec()方法,或者再写一个
void setMyVecByIndex(int index, bool v){...}
,void setMyVec(QVector<bool> v);
是必须要有的,重载的或者新加的示例:void setMyVec(int index, bool value, QString option) { if(option.toLower() == "modify"){ m_myVec[index] = value; }else if(option.toLower() == "append"){ m_myVec.append(value); }else if(option.toLower() == "remove"){ m_myVec.removeAt(index); }else{ qCritical() << "wrong option in setConnState"; } Q_EMIT myVecChanged(); }
QML中对数组变量的操作
但是QML中无法直接使用C++中对应类型的成员方法
// QML中无法使用QVector的成员方法
m_myVec.size(); // C++中自然可以这样用
// 我在这里把类暴露为"test",以便QML调用
test.myVec.size(); // QML中这样用是不允许的
是因为QML中在使用暴露的变量时都会转为自身支持的类型,所以要使用QML自身的数组方法或者JS的方法
// QML中数组方法
test.myVec.length
// 使用JS数组方法,获取值等于true的元素个数
test.myVec.filter(function(v) {
return v === true;
}).length
javaScript常用数组方法如下( 详细的用法可自行搜索):
方法名 | 功能 | 返回值 | 会不会改变原数组 |
---|---|---|---|
push() | (在结尾)向数组添加一或多个元素 | 返回新数组长度 | 会 |
unshift() | (在开头)向数组添加一或多个元素 | 返回新数组长度 | 会 |
pop() | 删除数组的最后一位 | 返回被删除的数据 | 会 |
shift() | 移除数组的第一项 | 返回被删除的数据 | 会 |
reverse() | 反转数组中的元素 | 返回反转后数组 | 会 |
sort() | 以字母顺序(字符串Unicode码点)对数组进行排序 | 返回新数组 | 会 |
splice() | 在指定位置删除指定个数元素再增加任意个数元素 (实现数组任意位置的增删改) | 返回删除的数据所组成的数组 | 会 |
concat() | 通过合并(连接)现有数组来创建一个新数组 | 返回合并之后的数组 | 不会 |
join() | 用特定的字符,将数组拼接形成字符串 (默认",") | 返回拼接后的新数组 | 不会 |
slice() | 裁切指定位置的数组 | 被裁切的元素形成的新数组 | 不会 |
toString() | 将数组转换为字符串 | 新数组 | 不会 |
valueOf() | 查询数组原始值 | 数组的原始值 | 不会 |
indexOf() | 查询某个元素在数组中第一次出现的位置 存在该元素,返回下标,不存在 | 返回 -1 | 不会 |
lastIndexOf() | 反向查询数组某个元素在数组中第一次出现的位置 存在该元素,返回下标,不存在 | 返回 -1 | 不会 |
forEach() | (迭代) 遍历数组,每次循环中执行传入的回调函数 | 无/(undefined) | 不会 |
map() | (迭代) 遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组 | 有/自定义 | 不会 |
filter() | (迭代) 遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中 | 满足条件的元素组成的新数组 | 不会 |
every() | (迭代) 判断数组中所有的元素是否满足某个条件 | 全都满足返回true 只要有一个不满足返回false | 不会 |
some() | (迭代) 判断数组中是否存在,满足某个条件的元素 | 只要有一个元素满足条件就返回true,都不满足返回false | 不会 |
reduce() | (归并)遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中 | 最终操作的结果 | 不会 |
reduceRight() | (归并)用法同reduce,只不过是从右向左 | 同reduce | 不会 |
includes() | 判断一个数组是否包含一个指定的值. | 是返回 true,否则false | 不会 |
Array.from() | 接收伪数组,返回对应的真数组 | 对应的真数组 | 不会 |
find() | 遍历数组,执行回调函数,回调函数执行一个条件,返回满足条件的第一个元素,不存在返回undefined | 满足条件第一个元素/否则返回undefined | 不会 |
findIndex() | 遍历数组,执行回调函数,回调函数接受一个条件,返回满足条件的第一个元素下标,不存在返回-1 | 满足条件第一个元素下标,不存在=>-1 | 不会 |
fill() | 用给定值填充一个数组 | 新数组 | 会 |
flat() | 用于将嵌套的数组“拉平”,变成一维的数组。 | 返回一个新数组 | 不会 |
flatMap() | flat()和map()的组合版 , 先通过map()返回一个新数组,再将数组拉平( 只能拉平一次 ) | 返回新数组 | 不会 |