mirror of
https://github.com/element-plus/element-plus.git
synced 2025-02-17 11:49:41 +08:00
549 lines
32 KiB
JavaScript
549 lines
32 KiB
JavaScript
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[115],{
|
|
|
|
/***/ 646:
|
|
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
|
|
"use strict";
|
|
// ESM COMPAT FLAG
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
|
// EXTERNAL MODULE: ./node_modules/vue/dist/vue.esm-browser.js
|
|
var vue_esm_browser = __webpack_require__(0);
|
|
|
|
// CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/dist/templateLoader.js??ref--6!./node_modules/vue-loader/dist??ref--2-0!./website/md-loader!./website/docs/es/tooltip.md?vue&type=template&id=7988f946&bindings={}
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_1 = {
|
|
class: "content element-doc"
|
|
};
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_2 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("h2", {
|
|
id: "tooltip"
|
|
}, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("a", {
|
|
class: "header-anchor",
|
|
href: "#tooltip"
|
|
}, "¶"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" Tooltip")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_3 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("p", null, "Mostrar aviso de información con el hover del mouse.", -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_4 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("h3", {
|
|
id: "uso-basico"
|
|
}, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("a", {
|
|
class: "header-anchor",
|
|
href: "#uso-basico"
|
|
}, "¶"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" Uso básico")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_5 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("p", null, "Tooltip tiene 9 colocaciones.", -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_6 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("div", null, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("p", null, [/*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])("Use el atributo "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "content"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" para establecer el contenido que se mostrará al hacer hover. El atributo "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "placement"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" determina la posición del tooltip. Su valor es "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "[orientation]-[alignment]"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" con cuatro orientaciones "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "top"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(", "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "left"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(", "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "right"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(", "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "bottom"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" y tres alineaciones "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "start"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(", "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "end"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(", "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "null"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(", la alineación default es null. Tome "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "placement=\"left-end\""), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" como ejemplo, Tooltip será mostrado en la izquierda del elemento en que se esté haciendo hover y el fondo del tooltip se alineará con el fondo del elemento.")])], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_7 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("pre", null, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", {
|
|
class: "html"
|
|
}, "<div class=\"box\">\n <div class=\"top\">\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Top Left prompts info\" placement=\"top-start\">\n <el-button>top-start</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Top Center prompts info\" placement=\"top\">\n <el-button>top</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Top Right prompts info\" placement=\"top-end\">\n <el-button>top-end</el-button>\n </el-tooltip>\n </div>\n <div class=\"left\">\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Left Top prompts info\" placement=\"left-start\">\n <el-button>left-start</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Left Center prompts info\" placement=\"left\">\n <el-button>left</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Left Bottom prompts info\" placement=\"left-end\">\n <el-button>left-end</el-button>\n </el-tooltip>\n </div>\n\n <div class=\"right\">\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Right Top prompts info\" placement=\"right-start\">\n <el-button>right-start</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Right Center prompts info\" placement=\"right\">\n <el-button>right</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Right Bottom prompts info\" placement=\"right-end\">\n <el-button>right-end</el-button>\n </el-tooltip>\n </div>\n <div class=\"bottom\">\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Bottom Left prompts info\" placement=\"bottom-start\">\n <el-button>bottom-start</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Bottom Center prompts info\" placement=\"bottom\">\n <el-button>bottom</el-button>\n </el-tooltip>\n <el-tooltip class=\"item\" effect=\"dark\" content=\"Bottom Right prompts info\" placement=\"bottom-end\">\n <el-button>bottom-end</el-button>\n </el-tooltip>\n </div>\n</div>\n\n<style>\n .box {\n width: 400px;\n\n .top {\n text-align: center;\n }\n\n .left {\n float: left;\n width: 110px;\n }\n\n .right {\n float: right;\n width: 110px;\n }\n\n .bottom {\n clear: both;\n text-align: center;\n }\n\n .item {\n margin: 4px;\n }\n\n .left .el-tooltip__popper,\n .right .el-tooltip__popper {\n padding: 8px 10px;\n }\n\n .el-button {\n width: 110px;\n }\n }\n</style>\n")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_8 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("h3", {
|
|
id: "tema"
|
|
}, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("a", {
|
|
class: "header-anchor",
|
|
href: "#tema"
|
|
}, "¶"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" Tema")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_9 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("p", null, [/*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])("Tooltip tiene dos temas: "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "dark"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" y "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "light"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(".")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_10 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("div", null, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("p", null, [/*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])("Establecer "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "effect"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" para modificar el tema, el valor por defecto es "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "dark"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(".")])], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_11 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("pre", null, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", {
|
|
class: "html"
|
|
}, "<el-tooltip content=\"Top center\" placement=\"top\">\n <el-button>Dark</el-button>\n</el-tooltip>\n<el-tooltip content=\"Bottom center\" placement=\"bottom\" effect=\"light\">\n <el-button>Light</el-button>\n</el-tooltip>\n")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_12 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("h3", {
|
|
id: "mas-contenido"
|
|
}, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("a", {
|
|
class: "header-anchor",
|
|
href: "#mas-contenido"
|
|
}, "¶"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" Más Contenido")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_13 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("p", null, "Despliegue múltiples líneas de texto y establezca su formato.", -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_14 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("div", null, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("p", null, [/*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])("Sobrecriba el atributo "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "content"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" del "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "el-tooltip"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(" añadiendo un slot llamado "), /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", null, "content"), /*#__PURE__*/Object(vue_esm_browser["n" /* createTextVNode */])(".")])], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_15 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("pre", null, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", {
|
|
class: "html"
|
|
}, "<el-tooltip placement=\"top\">\n <template #content>\n multiple lines<br/>second line\n </template>\n <el-button>Top center</el-button>\n</el-tooltip>\n")], -1);
|
|
|
|
var tooltipvue_type_template_id_7988f946_bindings_hoisted_16 = /*#__PURE__*/Object(vue_esm_browser["m" /* createStaticVNode */])("<h3 id=\"uso-avanzado\"><a class=\"header-anchor\" href=\"#uso-avanzado\">¶</a> Uso Avanzado</h3><p>Adicional a los usos básicos, existen algunos atributos que permiten la personalización:</p><p>el atributo <code>transition</code> permite personalizar la animación con la que el Tooltip se muestra o se esconda, el valor por defecto es <code>el-fade-in-linear</code>.</p><p>el atributo <code>disabled</code> permite deshabilitar <code>tooltip</code>. Solo es necesario definirlo como <code>true</code>.</p><p>De hecho, Tooltip es una extensión basada en <a href=\"https://github.com/element-component/vue-popper\">Vue-popper</a>, es posible utilizar cualquier atributo permitido en Vue-popper.</p>", 5);
|
|
|
|
var _hoisted_21 = /*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("pre", null, [/*#__PURE__*/Object(vue_esm_browser["o" /* createVNode */])("code", {
|
|
class: "html"
|
|
}, "<template>\n <el-tooltip :disabled=\"disabled\" content=\"click to close tooltip function\" placement=\"bottom\" effect=\"light\">\n <el-button @click=\"disabled = !disabled\">click to {{disabled ? 'active' : 'close'}} tooltip function</el-button>\n </el-tooltip>\n</template>\n\n<script>\n export default {\n data() {\n return {\n disabled: false\n };\n }\n };\n</script>\n\n<style>\n .slide-fade-enter-active {\n transition: all .3s ease;\n }\n .slide-fade-leave-active {\n transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);\n }\n .slide-fade-enter, .expand-fade-leave-active {\n margin-left: 20px;\n opacity: 0;\n }\n</style>\n")], -1);
|
|
|
|
var _hoisted_22 = /*#__PURE__*/Object(vue_esm_browser["m" /* createStaticVNode */])("<div class=\"tip\"><p>El componente <code>router-link</code> no es soportado por Tooltip, favor de usar <code>vm.$router.push</code>.</p><p>Elementos de forma deshabilitados no son soportados por Tooltip, más información puede ser encontrada en <a href=\"https://developer.mozilla.org/en-US/docs/Web/Events/mouseenter\">MDN</a>. Es necesario envolver los elementos de forma deshabilitados en un elemento contenedor para que Tooltipo funcione.</p></div><h3 id=\"atributos\"><a class=\"header-anchor\" href=\"#atributos\">¶</a> Atributos</h3><table><thead><tr><th>Atributo</th><th>Descripción</th><th>Tipo</th><th>Valores aceptados</th><th>Por defecto</th></tr></thead><tbody><tr><td>effect</td><td>tema del Tooltip</td><td>string</td><td>dark/light</td><td>dark</td></tr><tr><td>content</td><td>contenido a mostrar, puede ser sobre-escrito por <code>slot#content</code></td><td>string</td><td>—</td><td>—</td></tr><tr><td>placement</td><td>posición del Tooltip</td><td>string</td><td>top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end</td><td>bottom</td></tr><tr><td>value / v-model</td><td>visibilidad del Tooltip</td><td>boolean</td><td>—</td><td>false</td></tr><tr><td>disabled</td><td>saber si el Tooltip se encuentra deshabilitado</td><td>boolean</td><td>—</td><td>false</td></tr><tr><td>offset</td><td>offset del Tooltip</td><td>number</td><td>—</td><td>0</td></tr><tr><td>transition</td><td>nombre de animación</td><td>string</td><td>—</td><td>el-fade-in-linear</td></tr><tr><td>visible-arrow</td><td>si una flecha es mostrada. Para mayor información, revisar la página de <a href=\"https://github.com/element-component/vue-popper\">Vue-popper</a></td><td>boolean</td><td>—</td><td>true</td></tr><tr><td>popper-options</td><td>parámetros de <a href=\"https://popper.js.org/documentation.html\">popper.js</a></td><td>Object</td><td>referirse a la documentación de <a href=\"https://popper.js.org/documentation.html\">popper.js</a></td><td><code>{ boundariesElement: 'body', gpuAcceleration: false }</code></td></tr><tr><td>open-delay</td><td>retraso de la apariencia, en milisegundos</td><td>number</td><td>—</td><td>0</td></tr><tr><td>manual</td><td>si el Tooltipo será controlado de forma manual. <code>mouseenter</code> y <code>mouseleave</code> no tendrán efecto si fue establecido como <code>true</code></td><td>boolean</td><td>—</td><td>false</td></tr><tr><td>popper-class</td><td>nombre de clase personalizada para el popper del Tooltip</td><td>string</td><td>—</td><td>—</td></tr><tr><td>enterable</td><td>si el mouse puede entrar al Tooltip</td><td>Boolean</td><td>—</td><td>true</td></tr><tr><td>hide-after</td><td>tiempo a esperar en milisegundos para esconder el Tooltip</td><td>number</td><td>—</td><td>0</td></tr><tr><td>tabindex</td><td><a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex\">tabindex</a> of Tooltip</td><td>number</td><td>—</td><td>0</td></tr></tbody></table>", 3);
|
|
|
|
function tooltipvue_type_template_id_7988f946_bindings_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
var _component_element_demo0 = Object(vue_esm_browser["P" /* resolveComponent */])("element-demo0");
|
|
|
|
var _component_demo_block = Object(vue_esm_browser["P" /* resolveComponent */])("demo-block");
|
|
|
|
var _component_element_demo1 = Object(vue_esm_browser["P" /* resolveComponent */])("element-demo1");
|
|
|
|
var _component_element_demo2 = Object(vue_esm_browser["P" /* resolveComponent */])("element-demo2");
|
|
|
|
var _component_element_demo3 = Object(vue_esm_browser["P" /* resolveComponent */])("element-demo3");
|
|
|
|
return Object(vue_esm_browser["G" /* openBlock */])(), Object(vue_esm_browser["j" /* createBlock */])("section", tooltipvue_type_template_id_7988f946_bindings_hoisted_1, [tooltipvue_type_template_id_7988f946_bindings_hoisted_2, tooltipvue_type_template_id_7988f946_bindings_hoisted_3, tooltipvue_type_template_id_7988f946_bindings_hoisted_4, tooltipvue_type_template_id_7988f946_bindings_hoisted_5, Object(vue_esm_browser["o" /* createVNode */])(_component_demo_block, null, {
|
|
source: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [Object(vue_esm_browser["o" /* createVNode */])(_component_element_demo0)];
|
|
}),
|
|
highlight: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [tooltipvue_type_template_id_7988f946_bindings_hoisted_7];
|
|
}),
|
|
default: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [tooltipvue_type_template_id_7988f946_bindings_hoisted_6];
|
|
}),
|
|
_: 1
|
|
}), tooltipvue_type_template_id_7988f946_bindings_hoisted_8, tooltipvue_type_template_id_7988f946_bindings_hoisted_9, Object(vue_esm_browser["o" /* createVNode */])(_component_demo_block, null, {
|
|
source: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [Object(vue_esm_browser["o" /* createVNode */])(_component_element_demo1)];
|
|
}),
|
|
highlight: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [tooltipvue_type_template_id_7988f946_bindings_hoisted_11];
|
|
}),
|
|
default: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [tooltipvue_type_template_id_7988f946_bindings_hoisted_10];
|
|
}),
|
|
_: 1
|
|
}), tooltipvue_type_template_id_7988f946_bindings_hoisted_12, tooltipvue_type_template_id_7988f946_bindings_hoisted_13, Object(vue_esm_browser["o" /* createVNode */])(_component_demo_block, null, {
|
|
source: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [Object(vue_esm_browser["o" /* createVNode */])(_component_element_demo2)];
|
|
}),
|
|
highlight: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [tooltipvue_type_template_id_7988f946_bindings_hoisted_15];
|
|
}),
|
|
default: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [tooltipvue_type_template_id_7988f946_bindings_hoisted_14];
|
|
}),
|
|
_: 1
|
|
}), tooltipvue_type_template_id_7988f946_bindings_hoisted_16, Object(vue_esm_browser["o" /* createVNode */])(_component_demo_block, null, {
|
|
source: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [Object(vue_esm_browser["o" /* createVNode */])(_component_element_demo3)];
|
|
}),
|
|
highlight: Object(vue_esm_browser["eb" /* withCtx */])(function () {
|
|
return [_hoisted_21];
|
|
}),
|
|
_: 1
|
|
}), _hoisted_22]);
|
|
}
|
|
// CONCATENATED MODULE: ./website/docs/es/tooltip.md?vue&type=template&id=7988f946&bindings={}
|
|
|
|
// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/extends.js
|
|
var helpers_extends = __webpack_require__(7);
|
|
var extends_default = /*#__PURE__*/__webpack_require__.n(helpers_extends);
|
|
|
|
// CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/dist??ref--2-0!./website/md-loader!./website/docs/es/tooltip.md?vue&type=script&lang=ts
|
|
|
|
|
|
/* harmony default export */ var tooltipvue_type_script_lang_ts = ({
|
|
name: 'component-doc',
|
|
components: {
|
|
"element-demo0": function () {
|
|
var _createTextVNode = vue_esm_browser["n" /* createTextVNode */],
|
|
_resolveComponent = vue_esm_browser["P" /* resolveComponent */],
|
|
_withCtx = vue_esm_browser["eb" /* withCtx */],
|
|
_createVNode = vue_esm_browser["o" /* createVNode */],
|
|
_openBlock = vue_esm_browser["G" /* openBlock */],
|
|
_createBlock = vue_esm_browser["j" /* createBlock */];
|
|
var _hoisted_1 = {
|
|
class: "box"
|
|
};
|
|
var _hoisted_2 = {
|
|
class: "top"
|
|
};
|
|
|
|
var _hoisted_3 = /*#__PURE__*/_createTextVNode("top-start");
|
|
|
|
var _hoisted_4 = /*#__PURE__*/_createTextVNode("top");
|
|
|
|
var _hoisted_5 = /*#__PURE__*/_createTextVNode("top-end");
|
|
|
|
var _hoisted_6 = {
|
|
class: "left"
|
|
};
|
|
|
|
var _hoisted_7 = /*#__PURE__*/_createTextVNode("left-start");
|
|
|
|
var _hoisted_8 = /*#__PURE__*/_createTextVNode("left");
|
|
|
|
var _hoisted_9 = /*#__PURE__*/_createTextVNode("left-end");
|
|
|
|
var _hoisted_10 = {
|
|
class: "right"
|
|
};
|
|
|
|
var _hoisted_11 = /*#__PURE__*/_createTextVNode("right-start");
|
|
|
|
var _hoisted_12 = /*#__PURE__*/_createTextVNode("right");
|
|
|
|
var _hoisted_13 = /*#__PURE__*/_createTextVNode("right-end");
|
|
|
|
var _hoisted_14 = {
|
|
class: "bottom"
|
|
};
|
|
|
|
var _hoisted_15 = /*#__PURE__*/_createTextVNode("bottom-start");
|
|
|
|
var _hoisted_16 = /*#__PURE__*/_createTextVNode("bottom");
|
|
|
|
var _hoisted_17 = /*#__PURE__*/_createTextVNode("bottom-end");
|
|
|
|
function render(_ctx, _cache) {
|
|
var _component_el_button = _resolveComponent("el-button");
|
|
|
|
var _component_el_tooltip = _resolveComponent("el-tooltip");
|
|
|
|
return _openBlock(), _createBlock("div", null, [_createVNode("div", _hoisted_1, [_createVNode("div", _hoisted_2, [_createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Top Left prompts info",
|
|
placement: "top-start"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_3];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Top Center prompts info",
|
|
placement: "top"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_4];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Top Right prompts info",
|
|
placement: "top-end"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_5];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
})]), _createVNode("div", _hoisted_6, [_createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Left Top prompts info",
|
|
placement: "left-start"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_7];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Left Center prompts info",
|
|
placement: "left"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_8];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Left Bottom prompts info",
|
|
placement: "left-end"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_9];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
})]), _createVNode("div", _hoisted_10, [_createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Right Top prompts info",
|
|
placement: "right-start"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_11];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Right Center prompts info",
|
|
placement: "right"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_12];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Right Bottom prompts info",
|
|
placement: "right-end"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_13];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
})]), _createVNode("div", _hoisted_14, [_createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Bottom Left prompts info",
|
|
placement: "bottom-start"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_15];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Bottom Center prompts info",
|
|
placement: "bottom"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_16];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
class: "item",
|
|
effect: "dark",
|
|
content: "Bottom Right prompts info",
|
|
placement: "bottom-end"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_17];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
})])])]);
|
|
}
|
|
|
|
var democomponentExport = {};
|
|
return extends_default()({
|
|
render: render
|
|
}, democomponentExport);
|
|
}(),
|
|
"element-demo1": function () {
|
|
var _createTextVNode = vue_esm_browser["n" /* createTextVNode */],
|
|
_resolveComponent = vue_esm_browser["P" /* resolveComponent */],
|
|
_withCtx = vue_esm_browser["eb" /* withCtx */],
|
|
_createVNode = vue_esm_browser["o" /* createVNode */],
|
|
_openBlock = vue_esm_browser["G" /* openBlock */],
|
|
_createBlock = vue_esm_browser["j" /* createBlock */];
|
|
|
|
var _hoisted_1 = /*#__PURE__*/_createTextVNode("Dark");
|
|
|
|
var _hoisted_2 = /*#__PURE__*/_createTextVNode("Light");
|
|
|
|
function render(_ctx, _cache) {
|
|
var _component_el_button = _resolveComponent("el-button");
|
|
|
|
var _component_el_tooltip = _resolveComponent("el-tooltip");
|
|
|
|
return _openBlock(), _createBlock("div", null, [_createVNode(_component_el_tooltip, {
|
|
content: "Top center",
|
|
placement: "top"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_1];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}), _createVNode(_component_el_tooltip, {
|
|
content: "Bottom center",
|
|
placement: "bottom",
|
|
effect: "light"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_2];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
})]);
|
|
}
|
|
|
|
var democomponentExport = {};
|
|
return extends_default()({
|
|
render: render
|
|
}, democomponentExport);
|
|
}(),
|
|
"element-demo2": function () {
|
|
var _createVNode = vue_esm_browser["o" /* createVNode */],
|
|
_createTextVNode = vue_esm_browser["n" /* createTextVNode */],
|
|
_resolveComponent = vue_esm_browser["P" /* resolveComponent */],
|
|
_withCtx = vue_esm_browser["eb" /* withCtx */],
|
|
_openBlock = vue_esm_browser["G" /* openBlock */],
|
|
_createBlock = vue_esm_browser["j" /* createBlock */];
|
|
|
|
var _hoisted_1 = /*#__PURE__*/_createTextVNode(" multiple lines");
|
|
|
|
var _hoisted_2 = /*#__PURE__*/_createVNode("br", null, null, -1);
|
|
|
|
var _hoisted_3 = /*#__PURE__*/_createTextVNode("second line ");
|
|
|
|
var _hoisted_4 = /*#__PURE__*/_createTextVNode("Top center");
|
|
|
|
function render(_ctx, _cache) {
|
|
var _component_el_button = _resolveComponent("el-button");
|
|
|
|
var _component_el_tooltip = _resolveComponent("el-tooltip");
|
|
|
|
return _openBlock(), _createBlock("div", null, [_createVNode(_component_el_tooltip, {
|
|
placement: "top"
|
|
}, {
|
|
content: _withCtx(function () {
|
|
return [_hoisted_1, _hoisted_2, _hoisted_3];
|
|
}),
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, null, {
|
|
default: _withCtx(function () {
|
|
return [_hoisted_4];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
})]);
|
|
}
|
|
|
|
var democomponentExport = {};
|
|
return extends_default()({
|
|
render: render
|
|
}, democomponentExport);
|
|
}(),
|
|
"element-demo3": function () {
|
|
var _toDisplayString = vue_esm_browser["T" /* toDisplayString */],
|
|
_createTextVNode = vue_esm_browser["n" /* createTextVNode */],
|
|
_resolveComponent = vue_esm_browser["P" /* resolveComponent */],
|
|
_withCtx = vue_esm_browser["eb" /* withCtx */],
|
|
_createVNode = vue_esm_browser["o" /* createVNode */],
|
|
_openBlock = vue_esm_browser["G" /* openBlock */],
|
|
_createBlock = vue_esm_browser["j" /* createBlock */];
|
|
|
|
function render(_ctx, _cache) {
|
|
var _component_el_button = _resolveComponent("el-button");
|
|
|
|
var _component_el_tooltip = _resolveComponent("el-tooltip");
|
|
|
|
return _openBlock(), _createBlock("div", null, [_createVNode(_component_el_tooltip, {
|
|
disabled: _ctx.disabled,
|
|
content: "click to close tooltip function",
|
|
placement: "bottom",
|
|
effect: "light"
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createVNode(_component_el_button, {
|
|
onClick: _cache[1] || (_cache[1] = function ($event) {
|
|
return _ctx.disabled = !_ctx.disabled;
|
|
})
|
|
}, {
|
|
default: _withCtx(function () {
|
|
return [_createTextVNode("click to " + _toDisplayString(_ctx.disabled ? 'active' : 'close') + " tooltip function", 1
|
|
/* TEXT */
|
|
)];
|
|
}),
|
|
_: 1
|
|
})];
|
|
}),
|
|
_: 1
|
|
}, 8, ["disabled"])]);
|
|
}
|
|
|
|
var democomponentExport = {
|
|
data: function data() {
|
|
return {
|
|
disabled: false
|
|
};
|
|
}
|
|
};
|
|
return extends_default()({
|
|
render: render
|
|
}, democomponentExport);
|
|
}()
|
|
}
|
|
});
|
|
// CONCATENATED MODULE: ./website/docs/es/tooltip.md?vue&type=script&lang=ts
|
|
|
|
// CONCATENATED MODULE: ./website/docs/es/tooltip.md
|
|
|
|
|
|
|
|
tooltipvue_type_script_lang_ts.render = tooltipvue_type_template_id_7988f946_bindings_render
|
|
|
|
/* harmony default export */ var tooltip = __webpack_exports__["default"] = (tooltipvue_type_script_lang_ts);
|
|
|
|
/***/ })
|
|
|
|
}]); |