How to implement element ui Cascader cascade selector if you want to support multiple selection

the cascade selector of element ui is intended to support multiple selections displayed in the column in the form of tag, as shown in figure
clipboard.png
html code 

    <el-cascader
        :options="options"
        :show-all-levels="false"
        v-model="selectedOptions"
        @change="addOption"
      ></el-cascader>

in each change callback, you will get a [parent value, subset value]. I want to display only the subset value and then achieve the effect of multiple selections.
I originally intended to dynamically add the current value, selectedOptions format to selectedOptions push in each change callback as [[parent value, subset value], [parent value, subset value]], but did not implement it. I don"t know if anyone has ever realized

.
Vue.js
Mar.06,2021

write a div to locate the cascade selector

clipboard.png
selectedOptions tagdatanamepush value

clipboard.png

clipboard.png

you can try this: https://github.com/Charming20.
cascaded multiple selector based on element-ui, friendly display of drop-down arrows, consistent style with element, and support for most of the functions of multiple selector and cascade selector.

there is a ready-made

https://github.com/newPromise.

https://github.com/webCoderJ/. can try this and write a

Big Brother. You can't add some default options, that is, I want to add a role to the user, but the existing role must be displayed in the check box before it is selected.

you can select the first two columns. When you select the third column, only get the third column data, select the first two columns and not select the third column, get the second column data

some time ago, the business needs to do all the handshake and retain all the functions of element-ui. And made some extensions
https://www.npmjs.com/package.

Previous: What do these two lines of code mean?

Next: Nginx 403

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu