vue 组合组件
w-component-vue (w-component-vue)
A combination for vue component.
vue组件的组合。
例 (Example)
To view some examples for more understanding, visit examples:
要查看一些示例以进一步了解,请访问示例:
all components: web [source code]
安装 (Installation)
使用npm(ES6模块): (Using npm(ES6 module):)
Note: w-component-vue depends on
vuetify
.注意: w-component-vue取决于
vuetify
。
npm i w-component-vue
Import all components:
导入所有组件:
//choose component
<w-text
...
></w-text>
//import
import WComponentVue from 'w-component-vue'
//use
Vue.use(WComponentVue)
Import one component:
导入一个组件:
//choose component
<w-text
...
></w-text>
//import
import WText from 'w-component-vue/src/components/WText.vue'
//component
Vue.component('w-text',WText)
在浏览器(UMD模块)中: (In a browser(UMD module):)
Note: umd file includes with
element-ui
,lodash
andwsemi
, by using tree-shaking for dead-code elimination.注意: umd文件使用
element-ui
,lodash
和wsemi
包括wsemi
,通过使用摇树来消除死代码。
[Optional] Add script with nomodule for IE11.
[可选]为IE11添加带有nomodule的脚本。
<script nomodule src="https://cdn.jsdelivr.net/npm/@babel/polyfill/dist/polyfill.min.js"></script>
[Necessary] Add script for vue.
[必要]为vue添加脚本。
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
[Optional] Add link for icon.
[可选]添加图标链接。
<link href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css" rel="stylesheet">
<link href="https://use.fontawesome.com/releases/v5.10.0/css/all.css" rel="stylesheet">
[Necessary] Add script and link for vuetify.
[必要]添加脚本和链接以进行vuetify。
<link href="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.js"></script>
[Necessary] Add script for w-component-vue.
[必要]为w-component-vue添加脚本。
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/w-component-vue.umd.js"></script>
Directly use:
直接使用:
//choose component
<w-text
...
></w-text>
//use
Vue.use(window['w-component-vue'])
//new
new Vue({
el: '#app',
data: {
...
}
})
翻译自: https://vuejsexamples.com/a-combination-for-vue-component/
vue 组合组件