コンポーネント内でElement UI を部分的に使う

他のUIフレームワークを使っているなど、どうしても部分的にElement UI のコンポーネントを使いたくなった時。

まずは npm で Element UI をインストール。

npm i element-ui -S

コンポーネントファイルの中で、使いたいElement UI コンポーネントと、そのCSSを読み込む。

(ここでは、el-button)


MyComponent.vue


<template>
<div>
<el-button type="primary" plain> MyButton </el-button>
</div>
</template>

<script>
import {Button} from 'element-ui';

export default {
components: {
'ElButton': Button,
}
}
</script>

<style lang="scss">
@import "~element-ui/lib/theme-chalk/button.css";
</style>


これだけ。

詳しくは http://element.eleme.io/#/en-US/component/quickstart#on-demand

コンポーネントの一覧もここ。