SoFunction
Updated on 2025-03-03

Detailed explanation of the difference between passing parameters and not passing parameters under vue

Detailed explanation of the difference between passing parameters and not passing parameters under vue

Updated: September 15, 2018 10:23:51 Author: Uchiha Yusuke
Today, the editor will share with you a detailed explanation of the difference between passing parameters and not passing parameters under vue click event. It has good reference value and hope it will be helpful to everyone. Let's take a look with the editor

As shown below:

<div id = 'app'>
  <p><button @click = 'test_click1'>{{btn_text1}}</button></p>
  <br>
  <p><button @click = 'test_click2("123")'>{{btn_text2}}</button></p>
 </div>

 <script src="/vue/2.5.8/"></script>
 <script type="text/javascript">

  var _vm = new Vue({
   data : {
    btn_text1 : 'Click 1' ,
    btn_text2 : 'Click 2'
   },
   methods : {
    test_click1 : function (e) {
     ('test_click1--------------------------') ;
     (e) ;   
     // Output result: MouseEvent {isTrusted: true, screenX: 40, screenY: 121, clientX: 40, clientY: 30, …}
     () ;  // Output result: <button>Click 1</button>     ('test_click1--------------------------') ;
    },
    test_click2 : function (e) {
     ('test_click2--------------------------') ;
     (e) ;   // Output result: 123     () ;  // Output result: undefined     ('test_click2--------------------------') ;
    }
   }
  }).$mount('#app');
 &lt;/script&gt;

The above detailed explanation of the difference between passing the parameter and not passing the parameter under vue click event is all the content shared by the editor. I hope it can give you a reference and I hope you can support me more.

  • vue
  • Click
  • event
  • Transfer the ginseng

Related Articles

  • element-ui about the use of component BackToTop back to top

    This article mainly introduces the use of element-ui component BackToTop back to the top. It has good reference value. I hope it will be helpful to everyone. If there are any errors or no complete considerations, I hope you will be very encouraged.
    2024-03-03

  • Detailed example of element-ui modifying el-form-item style

    When using the element-ui component library, you often need to modify the original style. The following article mainly introduces detailed examples of element-ui modifying the el-form-item style. The article introduces the example code in detail. Friends who need it can refer to it.
    2022-11-11

  • Vue sends websocket request and http post request instance code

    This article mainly introduces the method of vue to send websocket requests and http post requests. This article introduces it to you in detail through the example code, which has certain reference value. Friends who need it can refer to it.
    2019-07-07

  • How to modify the style of NavBar navigation bar in the vant-ui component library

    This article mainly introduces how to modify the style of the NavBar navigation bar in the vant-ui component library. It has good reference value and hopes it will be helpful to everyone. If there are any mistakes or no complete considerations, I hope you will be very grateful for your advice
    2022-08-08

  • The principle of Vue implements two-way binding and the method of responsive data

    This article mainly introduces the principle of Vue to implement two-way binding and the method of responsive data. The editor thinks it is quite good. I will share it with you now and give you a reference. Let's take a look with the editor
    2018-07-07

  • vue2.0 How to implement WeChat sharing in hash mode

    This article mainly introduces how vue2.0 can realize WeChat sharing in hash mode. The editor thinks it is quite good. I will share it with you now and give you a reference. Let's take a look with the editor
    2019-01-01

  • Detailed explanation of Pinia’s Setup Stores syntax use example

    This article mainly introduces Pinia’s Setup Stores syntax examples for you. Friends in need can refer to it for reference. I hope it can be helpful. I wish you more progress and get a promotion as soon as possible.
    2022-09-09

  • Vue-CLI multi-page directory packaging step records

    This article mainly introduces relevant materials about Vue-CLI multi-page directory packaging. The article introduces the example code in detail, which has certain reference learning value for everyone's study or work. Friends who need it, please learn with the editor below.
    2021-04-04

  • Examples of the use of 7 types of route guards in vue3

    I'm learning vue recently. I feel that there are many knowledge points in the route guard place, and it's very important. The following article mainly introduces you to the use of 7 route guards in vue3. The article introduces the example code in detail. Friends who need it can refer to it.
    2023-03-03

  • The solution is that there are too many requested data in the vue project, causing the page to be stuck.

    This article mainly introduces the solution of the vue project that has a lot of requested data, which causes the page to be stuck. It has good reference value and hopes it will be helpful to everyone. If there are any mistakes or no complete considerations, I hope you will be very grateful for your advice
    2022-09-09

Latest Comments