同时引入elementui和vantui有什么问题
前端页面主要使用vant+postcss-pxtorem+lib-flexible,后端管理页面主要是使用elementUI进行开发。出现问题
postcss-pxtorem转化把px转化rem或者vm的时候会影响elementui的相关样式，所以在后端管理页面的编码中会出现直接从elementui粘贴过来的版式问题，下面是我的postcss.conifg.js文件的相关配置
module.exports = {
plugins: {
// ...
'postcss-px-to-viewport': {
unitToConvert: 'px',
viewportWidth: 320,
unitPrecision: 5,
propList: ['*'],
viewportUnit: 'vw',
fontViewportUnit: 'vw',
selectorBlackList: ['el'],
minPixelValue: 1,
mediaQuery: false,
replace: true,
exclude: undefined,
include: undefined,
landscape: false,
landscapeUnit: 'vw',
landscapeWidth: 568
}
}
}
登录后复制

排除其他的配置情况请注意 selectorBlackList 该字段可以排除某些样式不转化为vm，我在这里加上 el 就是把elementui相关的组件都不转化为vm，因此在开发后端页面的时候就可以看到直接从elementui粘贴复制过来的东西可以直接调整使用了。
绛旓細鍦elementUI 涓毦鍏嶄細浣跨敤table缁勪欢瀹屾垚鏄剧ず琛ㄦ牸鏁版嵁鐨勫姛鑳斤紝濡備笅渚嬪瓙锛氬皢鍚庡彴杩斿洖鐨勬暟鎹殑涓涓弬鏁板啀娆′紶缁欏悗鍙版帴鍙ｉ摼鎺ユ墦鍗癳xcel琛ㄦ牸銆
绛旓細<template> <el-form :model="formData" :rules="formRules" ref="form"> <el-form-item v-for="(item, index) in formConfig" :label="item.label" :key="index"> <template v-if="item.type === 'input'"> <el-input v-model="formData[item.field]" :placeholder=...
绛旓細涓銆佷粙缁 绠浠嬶細鍦ㄤ娇鐢elementUI el-form 涓紝瀵逛簬涓氬姟涓嶅悓鐨勬椂鍊欏彲鑳戒細浜х敓涓嶅悓琛ㄥ崟缁撴瀯锛屼絾鏄兘鏄瓨鍦ㄥ悓涓涓〃鍗曟帶浠秂l-form涓傚浘鐗囦粙缁嶏細1銆佸湪鐢ㄦ埛閫夋嫨鍗曢夋垨澶氶夋椂浼氭湁A,B,C,D,E浜斾釜閫夐」 2銆佸湪鐢ㄦ埛閫夋嫨绠绛旈鏃跺彧浼氶骞诧紝绛旀浠ュ強瑙ｆ瀽閫夐」锛堜富瑕佹槸閫氳繃v-if鏉ヨ繘琛屽垽鏂級闂寮曞叆锛氬綋鐢ㄦ埛閫夋嫨...
绛旓細vue缁勪欢涓坊鍔燛lement-UI 杩涘叆椤圭洰锛屾墦寮缁堢鎵ц锛歯pm i element-ui -S 鍦╩ain.js涓寮曠敤 import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';Vue.use(ElementUI);椤圭洰涓殑浣跨敤锛氭晥鏋滀竴锛屽疄鐜伴粯璁ゅ睍寮涓绾х洰褰-琛屼笟鑱氱劍锛歵emplate锛歴cript鍜宻tyle锛氭晥鏋滀簩锛屽疄鐜伴粯璁...
绛旓細elementUI鏈夋爡鏍 鍙互鑷傚簲
绛旓細Element UI 涓璭l-input 妗嗗洖杞﹁Е鍙戦〉闈㈠埛鏂伴棶棰樺強瑙ｅ喅鏂规鈥斺斿熀纭绉...浠婂ぉ鍋氫簡涓涓皬灏忕殑鍔熻兘,灏辨槸鍩轰簬elementUi妗嗘灦鐨勪竴涓緭鍏ユ,闇瑕佺洃鍚緭鍏ユ鐨勫洖杞︿簨浠,鐒跺悗璋冨彇鎺ュ彛銆 浠ｇ爜濡備笅: <el-form:model="ruleForm"label-width="100px"><el-form-item label="鐗╂枡缂栫爜"><el-input v-model="ruleForm......
绛旓細涓嶉渶瑕佺銆傛甯歌繍琛屽惎鍔ㄤ綘鐨勯」鐩氨鍙互
绛旓細寮曞叆鍙互锛屼絾涓嶈兘瀵煎嚭澶氱锛屽鏋滀綘鍙槸鍋氱綉椤靛紑鍙戯紝鍦ㄤ娇鐢╢lex甯冨眬鐨勫墠鎻愪笅鍙互鏀惧績澶ц儐寮曞叆elementUI銆備絾瀵煎嚭灏忕▼搴忎細鎶ラ敊銆倁niapp缁勪欢澶渚濊禆鎵╁睍缁勪欢灏辨棤娉曞疄鐜颁竴娆″紑鍙8绔鍑恒傞奔鍜岀唺鎺屼笉鍙吋寰楀樋鍢匡紝鍒╃敤uni鑷韩寮鍙戣繕鏄尯寮哄ぇ鐨
绛旓細 /* 3浠ｈ〃涓涓笂浼犳潈闄愮殑ID,鏉冮檺涓湁3鍒欐樉绀烘寜閽 */鎴戜滑鐩存帴娉ㄥ唽涓涓叏灞鎸囦护,鍒╃敤vnode鏉ヨ闂畍ue鐨...Vue + ElementUI 鎵嬫捀鍚庡彴绠＄悊缃戠珯涔嬫潈闄愭帶鍒舵墜鎽告墜,甯︿綘鐢╲ue鎾稿悗鍙颁箣鏉冮檺鎺у埗 鎶㈤璧 宸茶禐杩 宸
绛旓細options 鑿滃崟閰嶇疆锛屽氨鏄畬鍏ㄦ寜鐓elementui Cascader 鐨刼ptions鐨勬牸寮 涓锛宨ndex.vue 姝ら〉闈负涓昏鍑哄彛鏂囦欢锛屼細鍙戝皠鍑轰竴涓緱鍒伴変腑鍚庣殑item鐨勬柟娉曚互鍙婃暟缁勩備簩锛孧ulCheckCascader.vue //姝ら〉闈负鍩虹妯℃澘锛屼細鍦ㄨ椤甸潰寮曠敤閫掑綊鍑烘潵鐨勫閫夌殑item鐨勫瓧妯℃澘锛屽苟涓旇椤甸潰浼氭帴鍙楀紩鐢ㄩ〉闈紶杩囨潵鐨勬暟鎹紝鏂逛究鐏垫椿鎺...
