eslint 不喜欢,但是确实规范了代码,同古代统一货币一样,有无穷的意义。故喜欢
weex-ui在项目中的使用方法
npm install -g weex-toolkit@latest
weex create your_project
npm i
npm i weex-ui@latest -S
npm i babel-plugin-component babel-preset-stage-0 -D
//修改.babelrc代码
{
"presets": ["es2015", "stage-0"],
"plugins": [
[
"component",
{
"libraryName": "weex-ui",
"libDir": "packages",
"style": false
}
]
]
}
修改 src/index.vue 进行测试
<template>
<div>
<wxc-button text="Open Popup"
@wxcButtonClicked="buttonClicked">
</wxc-button>
<wxc-popup width="500"
pos="left"
:show="isShow"
@wxcPopupOverlayClicked="overlayClicked">
</wxc-popup>
</div>
</template>
<script>
import { WxcButton, WxcPopup } from 'weex-ui';
module.exports = {
components: { WxcButton, WxcPopup },
data: () => ({
isShow: false
}),
methods: {
buttonClicked () {
this.isShow = true;
},
overlayClicked () {
this.isShow = false;
}
}
};
</script>
运行项目
npm run serve
项目效果如下