一周技术总结和分享
这周工作中遇到了一个多层表格筛选列本地化的东西。最后的解决方式是用vux + core一起实现多层嵌套筛选项的本地化。
filterable-columns.js
const byGoodsCol = [
{
prop: 'all',
label: '全选',
children: [
{
prop: 'weidu1',
label: '维度分类1',
children: [
{
prop: 'a',
label: 'a'
},
{
prop: 'b',
label: 'b'
}
]
},
{
prop: 'weidu2',
label: '维度分类2',
children: [
{
prop: 'c',
label: 'c'
},
{
prop: 'd',
label: 'd'
}
]
}
]
}
]
export function outCol(type) {
return {
byGoodsCol: byGoodsCol,
byPlatfomrCol: byPlatfomrCol
}[type]
}
config/local-settings.js
import { outCol } from './filterable-columns'
const byGoodsCol = outCol('byGoodsCol')
function initDefaultCol(data) {
data.forEach(item => {
if (item.children) {
initDefaultCol(item.children)
}
item.checked = true
})
return data
}
export default {
byGoodsCol: initDefaultCol(byGoodsCol)
}
core.js
import defaultSettings from '@/config/local-settings'
export default function Initializer() {
store.commit('goods/goods_col', Vue.ls.get('BY_GOODS_COL', defaultSettings.byGoodsCol))
}
main.js
import initial from "./core/initial";
new Vue({
el: "#app",
router,
store,
created() {
initial();
},
render: h => h(App)
});
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。