Get the App
SLTechnology News&Howtos  ›  Development  › 

What is the implementation of multi-parameter input to el-dropdown in ElementUI?

Shulou Source: shulou.com Published: 2022-06-02 06:55:27 10月03日 Update

This article mainly explains the "ElementUI el-dropdown into the multi-parameter implementation method is what", the article explained the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in-depth, together to study and learn "ElementUI el-dropdown into the multi-parameter implementation method is what" it!

However, the handleCommand method in the official ElementUi documentation allows access to only one parameter, which is used to trigger which option you select. In fact, we also need to pass in an object with the current number of rows (if the data is displayed in table, as I do), and then use some fields of this object to pass to the backend for some operations of adding, deleting, modifying and querying.

An example of el-dropdown in the official ElementUi documentation is as follows:

El-dropdown official documentation

Drop-down menu Golden cake Lion head snail powder double skin milk oyster fried. El-dropdown-link {cursor: pointer; color: # 409EFF;} .el-icon-arrow-down {font-size: 12px;} export default {methods: {handleCommand (command) {this.$message ('click on item' + command);}

We must repackage the command parameter into an object before executing the handleCommand method so that it contains the data we want to make it easier to call later.

The code is as follows:

Other operations discarded upload original collation, freezing and thawing

Because we write it in the table, we need a slot to modify it according to the actual situation. Bind a method to the command attribute of the tag, and this method can pass in the parameters we want, then use this method to encapsulate an object, and then pass the object into the handleCommand method.

Export default {methods: {handleAbandon (index, row) {/ / todo}, handleUpload (index, row) {/ / todo}, handleSettle (index, row) {/ / todo}, beforeHandleCommand (index, row,command) {return {'index': index 'row': row,' command':command}}, handleCommand (command) {switch (command.command) {case "a": / / discarded this.handleAbandon (command.index,command.row) Break; case "b": / / upload original this.handleUpload (command.index,command.row); break; case "c": / / original finishing this.handleSettle (command.index,command.row); break Thank you for your reading. The above is the content of "what is the implementation method of multi-parameter input of el-dropdown in ElementUI". After the study of this article, I believe you have a deeper understanding of what is the implementation method of multi-parameter input of el-dropdown in ElementUI, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Tags: Methods parameters objects originals official documents learning content reality situation data encapsulation code background fields that is properties ideas articles more Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno NVidia Linux Xiaomi Shulou Information Apple