style: 调整微信小程序平台适配条件并优化魔方组件逻辑
1. 将MP-WEIXIN平台适配改为通用MP平台适配
2. 重构diy-rubik-cube组件的数据处理逻辑:
- 新增processedList存储处理后的列表数据
- 提取初始化列表逻辑为initList方法
- 新增对value属性的深度监听,动态更新列表
- 将原list计算属性改为直接返回processedList
This commit is contained in:
@@ -91,7 +91,8 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
customHtml: ''
|
||||
customHtml: '',
|
||||
processedList: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@@ -99,6 +100,7 @@ export default {
|
||||
this.value.diyHtml = this.value.diyHtml.replace(/"/g, '"');
|
||||
this.customHtml = htmlParser(this.value.diyHtml);
|
||||
} else {
|
||||
this.initList();
|
||||
var singleRow = {
|
||||
'row1-of2': {
|
||||
ratio: 2,
|
||||
@@ -127,18 +129,20 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [DiyMinx],
|
||||
watch: {
|
||||
// 组件刷新监听
|
||||
componentRefresh: function (nval) { }
|
||||
value: {
|
||||
handler() {
|
||||
if (this.value.mode != 'custom-rubik-cube') {
|
||||
this.initList();
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mixins: [DiyMinx],
|
||||
computed: {
|
||||
list() {
|
||||
var arr = JSON.parse(JSON.stringify(this.value.list));
|
||||
arr.forEach((item, index) => {
|
||||
item.pageItemStyle = this.countBorderRadius(this.value.mode, index);
|
||||
});
|
||||
return arr;
|
||||
return this.processedList;
|
||||
},
|
||||
rubikCubeWrapCss() {
|
||||
var obj = '';
|
||||
@@ -153,6 +157,17 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initList() {
|
||||
if (!this.value.list || !Array.isArray(this.value.list)) {
|
||||
this.processedList = [];
|
||||
return;
|
||||
}
|
||||
this.processedList = this.value.list.map((item, index) => {
|
||||
const newItem = { ...item };
|
||||
newItem.pageItemStyle = this.countBorderRadius(this.value.mode, index);
|
||||
return newItem;
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 魔方:单行多个,平分宽度
|
||||
* 公式:
|
||||
|
||||
@@ -240,7 +240,7 @@ export default {
|
||||
right: 28rpx !important;
|
||||
bottom: 200rpx !important;
|
||||
/* #endif */
|
||||
/* #ifdef MP-WEIXIN */
|
||||
/* #ifdef MP */
|
||||
right: 27rpx !important;
|
||||
bottom: 180rpx !important;
|
||||
/* #endif */
|
||||
|
||||
Reference in New Issue
Block a user