element 组件（el-popover）

el-popover

1. 如果要将页面1 test.vue的作为独立的组件应用在另一个页面上2上，并需要以弹框形式打开，可在页面2上直接引入，在页面2中使用el-popover组件，将其插入：

import test from './test' 
components: {test},

 <el-popover v-model="test"><el-input v-model="form.test" slot="reference" @click="test = true" ></el-input><lux-spec v-model="form.test" @close="test = false" ></lux-spec>            </el-popover>

2.trigger属性用于设置何时触发 Popover，支持四种触发方式：hover，click，focus 和 manual。对于触发 Popover 的元素，有两种写法：使用 slot="reference" 的具名插槽，或使用自定义指令v-popover指向 Popover 的索引ref。

<template><el-popoverplacement="top-start"title="标题"width="200"trigger="hover"content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。"><el-button slot="reference">hover 激活</el-button></el-popover><el-popoverplacement="bottom"title="标题"width="200"trigger="click"content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。"><el-button slot="reference">click 激活</el-button></el-popover><el-popoverref="popover"placement="right"title="标题"width="200"trigger="focus"content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。"></el-popover><el-button v-popover:popover>focus 激活</el-button><el-popoverplacement="bottom"title="标题"width="200"trigger="manual"content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。"v-model="visible"><el-button slot="reference" @click="visible = !visible">手动激活</el-button></el-popover>
</template><script>export default {data() {return {visible: false};}};
</script>