Questions tagged [element-plus]
The element-plus tag has no usage guidance.
element-plus
137
questions
0
votes
2
answers
51
views
CSS class disappeared without notice, where did it go?
I have this example table taken from https://element-plus.org/en-US/component/table.html#table-with-status
I would like to give some color for some rows.
Here is a minimal working example:
<script ...
- 4,058
0
votes
1
answer
27
views
vue.js and Element Plus - use el-select with key
I intend to make a drop-down menu that can have three values: The first can be 'Father' or 'Mother' depending on the condition returned by the autoGender(index) method. The second is always 'Father'. ...
- 137
1
vote
0
answers
25
views
How to remove '/page' text from page size dropdown in el-pagination
<el-pagination
v-model:current-page="currentPage2"
v-model:page-size="pageSize2"
:page-sizes="[100, 200, 300, 400]"
:small="small"
:disabled="...
- 11
0
votes
0
answers
45
views
Property change not detected in child component
I'm currently stuck on some data refreshing issue with Vue3 & xState.
(I don't think that xState is involved in this issue, but I'd rather mention it)
Data is not refreshed in child component when ...
- 1,127
0
votes
1
answer
45
views
Video cannot open more options in edge
<el-dialog v-model="videoDialog">
<video v-if="videoDialog" :src="videoSrc" style="width:100%;height:500px;" controls="controls" ...
0
votes
1
answer
68
views
How to set the locale of the Element-Plus Datepicker
I'm importing the DatePicker separately in main.ts, because I don't want the overhead of the full ElementPlus. However, how can I set the locale for the widget if I do this ?
This is the code without ...
- 10.9k
0
votes
1
answer
67
views
What's different between ElButton and el-button in element-plus use in vue
In element-plus official docs, component was imported by this way: ElButton, and used by this way: el-button.
In my practice, use element-plus in this way: ElButton can also work normally.
I wander ...
- 61
0
votes
0
answers
17
views
How to modify the default type of element-plus？
For example, the type of el-button is '' | 'text' | 'default' | 'success' | 'warning' | 'info' | 'primary' | 'danger', how to append a type cancel
'' | 'text' | 'default' | 'success' | 'warning' | '...
- 239
0
votes
0
answers
78
views
Element Plus Dropdown functions
I'm trying to attach custom functions to each dropdown item.
<el-dropdown-menu>
<el-dropdown-item @click="editarTenant(props.row.id, props.row.domain)">Editar Información&...
0
votes
1
answer
36
views
The true and false bound to el-dialog v-model cannot display el-dialog correctly
I tried using: visible sync, but it still didn't solve the problem. When I clicked the button, the dialog box did not appear. But the strange thing is that sometimes when I save the modified code in ...
0
votes
0
answers
43
views
When using collapsible vertical el-menu (Vue.js), the content of the page grows on menu collaps, but not shrinks back on menu expand
I'm using Vue.js 3 with Element Plus.
The structure of my SPA is next:
there is an el-menu on the left
there is a router-view on the right
in that router-view, there is a header in a form of an el-...
1
vote
1
answer
76
views
How to change the color of a button inside a sub-menu using vue js3 and element-plus
I've created a button in a sub-menu which when clicked should be able to change color
But whatever I do doesn't work.
This is the code for the button
I've added more code
Link to Vue playground where ...
- 59
0
votes
0
answers
347
views
How to customize Element Plus el-table
I'm new to Element Plus and have a little problem using el-table. Can anyone with experience using Element Plus give me an idea or something? I use VueJS and Element Plus. Thanks everyone in advance.
...
- 1
1
vote
1
answer
146
views
How to override the default style in element-plus
When ever i use any element-plus component there is always a default style and color given to it.
for example
<el-button type="primary">Primary</el-button>
it has a default ...
- 59
0
votes
1
answer
95
views
How to change the down arrow in a submenu in element-plus
I'm working on a website using vuejs3 and element-plus, there are supposed to be some submenus but when you use
<el-menu
:default-active="activeIndex"
class="el-menu-demo&...
- 59
1
vote
2
answers
55
views
Click() event on e2e test in cypress does not work, when used on Switch Element Plus component
When manually testing my Nuxt app, clicking on the switch element works, and it changes my global variable. But in the Cypress test, the switch remains switched off even if the click event runs ...
- 23
0
votes
0
answers
49
views
Dynamic table with dynamic rowspans using Vue.js and element plus
Hello i created a dynamic table component using element-plus, in Vue.js, like this (simple code)
<el-table :data="tableData" v-loading="loading" :show-header="header&...
- 99
0
votes
2
answers
148
views
How do I style the place holder and background of an input form using vue js and element-plus
I'm trying to change the font-style, font-size, font-weight and some others for the the placeholder and the internal part of an input form in vue3 and element plus.
i've tried styling it separately in ...
- 59
0
votes
1
answer
121
views
Error Element Plus Dynamic Tab component in Vue 3
How can i import Dynamic Component Content Field to my Tab in Element Plus in Vue 3? it's possible to do like that thank you for helping me
<template>
<el-tabs v-model="activeName"...
0
votes
0
answers
58
views
Navbar displaying in the middle of the screen
I'm currently trying to build a website using vue.js(vue3) and element-plus. I created a Navbar component in a Navbar.vue file and i tried adding it to the App.js file the Navbar keeps displaying in ...
- 59
0
votes
0
answers
31
views
Date Range Filtering from Rest Api to Element Plus table
still no data are being displayed
Display data using Date Range, The user choose the Start Date and End Date
The Problem is no data been displayed even though there is data in my Msql database
please ...
0
votes
0
answers
29
views
After element-plus is introduced through CDN, the component used is missing and an error is reported
In order to reduce the packaging volume, I set up externals using webpack and put element-plus inside.
module.exports = {
//plugins: [aPlugin],
externals: {
vue:'Vue',
...
- 1
0
votes
1
answer
61
views
Element-Plus Global API not working with Vue 3 Global API
I'm trying to use the ElementPlus as a global API but it is not working.
I add the Vue 3 unpkg link in HTML and ElementPlus unpkg link to run. But no output for ElementPlus.
<html>
<head>...
- 63
2
votes
0
answers
88
views
vue3+vite+elementPlus+plugin-vue-jsx+vscode occurred an error :Property 'el-button' does not exist on type 'JSX.IntrinsicElements'
i want to write jsx in vue3 project,i use vite+ts+vue3+elementPlus built my project. when i wrote the follow code , vscode occurred an error,but the page run well.
import { defineComponent, ref } from ...
- 129
0
votes
1
answer
147
views
Checkbox doesnt unchecked if it is checked initially in element-plus
I have checkbox using element-plus:
<el-checkbox
v-model="slotProps.action.check_control"
:checked="slotProps.action.check_control"
size="large"
class="ml-...
0
votes
0
answers
35
views
Translate months and days of the week from <el-date-picker> in Nuxt.js 3 with composition api
I'm using from element plus and I would like to translate the months and days of the week to pt-br. I'm using nuxt 3 with composition api and dayjs.
From what I saw, it should work automatically ...
- 1
1
vote
0
answers
310
views
vue 3 ElementPlusError: [ElPagination] Deprecated usages detected
I'm having problem with Vue 3 element-plus el-pagination, i have this warning:
ElementPlusError: [ElPagination] Deprecated usages detected, please refer to the el-pagination documentation for more ...
user20965237
0
votes
0
answers
91
views
Delete a row in a table without affecting the row after it
I'm learning about Vuejs and Element Plus
I tried creating a simple website. Initially there were 2 emails available
When selecting the add button 3 times to add a new email, enter the email in order ...
- 322
0
votes
0
answers
50
views
How to adapt to the formal parameter list of the 'use' function in Vue App?
As shown in the figure:
From the prompt, ElementPlus seems to be a
{
version: string;
install: (
app: App<any>,
options?: Partial<ConfigProviderProps> | undefined,
) => ...
- 1
-1
votes
1
answer
212
views
How to create a sidebar on the left and on the right is a page that is called from the list in the sidebar
I want to create a sidebar that can call another page and stay on that page
I have tried it but the result is that the page I want to display is redirected to another page and I have also tried a ...
0
votes
1
answer
316
views
Vue.js - element-plus - el-table-v2 - How to have a link in a cell with href containing cell value?
I'm using vue.js and a virtualized table from element-plus.
I want to have one of the columns to be a clickable link, href of which contains the data from the cell.
Table template:
<template>
...
0
votes
0
answers
131
views
RTLCSS And Element Plus With Vue Js Project
As element plus doesn't support RTL I had to use other third party libraries like rtlcss plugin and actually this is solved the problem, but not in my application case where i use both rtl and ltr ...
- 41
0
votes
1
answer
601
views
How to auto import unplugin-icons?
When I created a js project using vue-cli, I wanted to auto import elementplus and icons , but the project couldn't run after the import。How should I fix it and get it running properly？
the package....
0
votes
1
answer
285
views
How to get the root DOM element of an el-popover component in Element-Plus?
I'm using the el-popover component from Element-Plus in my Vue project to create a popover effect. Here's the code:
<el-button ref="saveButtonRef" class="misc-button" :loading=&...
- 3
0
votes
0
answers
308
views
vue3 + element-plus dynamic add form item validate falied
I occured a problem with inline rules in element-plus(vue3) form item. Following is the code I had writed.
<el-form
ref="packFormRef"
:model="packForm"
label-width=&...
- 115
0
votes
1
answer
43
views
Why is there a line break when there are two cols in element-plus?
Why is it that in element-plus, when there is one col in a row, it is displayed on the same line, but when there are two cols, it is displayed in a new line?
enter image description here
enter image ...
- 1
0
votes
1
answer
91
views
how to set dynamic pageSize in element-plus Layout grid?
<el-col
v-for="i in listVariables.list"
:key="i.id"
:xs="12"
:sm="12"
:md="8"
:lg="...
- 9
0
votes
0
answers
115
views
Can not get all el-tab-pane of el-tabs
exist 9 children and can print 9 children but only can get 8 of them
dom is
<el-tabs ref="tabs" v-model="activeName" type="card" @tab-remove="removeTab">...
0
votes
0
answers
393
views
El-Dialog from Element Plus is not working in JavaScript code
I am in the process of migrating Vue 2 to Vue 3. I was upgraded to Element Plus instead of element UI but following sample code is not working. can you please confirm whether Element Plus would work ...
0
votes
1
answer
395
views
How to insert other values into table column Vue3 Element-plus
I have an array of objects from database and objects have property 'sex' that equals 1 or 2. How can i convert these values to male(1) or female(2) using el-table?
I have no idea how to use this lib ...
0
votes
0
answers
218
views
Vue3, ElementPlus: Icon is not rendering within el-tab-pane while render the el-tabs using 'h' instance in Vue3 composition API
Environment
Vue Version: 3.3.2
Element Plus Version: 2.3.4
Browser / OS: Chrome
Build Tool: Vite
Related Component
el-tab-pane
Steps to reproduce
Please click the below links for minimal ...
0
votes
0
answers
56
views
How to get the ok button in element-plus daterange datePicker
I have a requirement of having ok button in element-plus daterange datePicker. i am getting it for datetimerange picker.But need it in daterange picker too.
How Can I get it. Please help me in this.
...
0
votes
1
answer
1k
views
How can I disable time in element plus datetime picker
I am using element plus DateTimePicker with vue3. how do I disable past time, from today's date. I didn't find any prop for the same
- 51
0
votes
0
answers
292
views
Remove upload button in "el-upload" with list-type="picture-card" from Element Plus when one file uploaded
I want to remove this empty square when file is already uploaded, and show again, if there is no files. el-upload file and upload button
I wrote this code but it actually do nothing in case of hiding/...
- 15
0
votes
0
answers
2k
views
vue3-Element Plus form validation failed
When I enter text in the workHour field of el-form-item, it shows the message of "required: true" instead of "type: 'number'".
Even when I enter a number greater than 1 in the ...
- 11
0
votes
1
answer
685
views
How to trigger el-select's remote-method again after filtering a non-existing option
Currently using Element Plus' el-select component.
When filtering for a non-existent option, remote-method triggers fine and returns the expected result (empty since option is non-existent).
Since ...
0
votes
1
answer
145
views
independant isActive states for groups of element plus buttons
<div class="dateNav">
<el-button-group>
<el-button type="danger" plain> Days </el-button>
<el-button type="danger" plain&...
- 89
0
votes
1
answer
193
views
How to load element-plus with Vue3 in cypress component test?
If in Vue2 , we can use the components of ElementPlus like this:
#/cypress/component.js
import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue....
- 1
1
vote
0
answers
131
views
Element-plus Autocomplete cause the page rerendering
Good day everyone,I have a question.
I use asp.net core razor page and Vue3 Options API to build the web APP,
now I want to use the el-autocomplete to suggest the user complete the input and the other ...
- 11
0
votes
2
answers
1k
views
vite problem: element-plus can not use import type
I am a novice and have been using vite recently. I have tested it and Google it, but I am still unable to solve the problem
In vite app, when i import element-plus type,like ElInput...
Error: Module '...
- 1