Shulou(Shulou.com)05/31 Report--

This article introduces the knowledge of "how to call methods externally in vue". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

1. First define a common vue component

Var eventHub = new Vue ()

two。 In the current component of the event, in created, the public component eventHub is passed with $on, translate is custom, and getCardNum (data) is the method to be called externally

EventHub.$on ('translate', function (data) {that.getCardNum (data);})

3. Finally, in the parent component, notice that the negative component is saved with a variable, var vm = new Vue ({})

4. Define a method in the method of methods in the parent component, and receive the method in the common component with $emit in the method

Var vm = new Vue ({el:'# example', data: {msg: 'Hello Directive', data: {}}, methods: {getCardNum: function (data, on) {eventHub.$emit (' translate', data);})

5. Finally, the function getCardNum (data) can be called outside the vue component or file, for example, onclick = vm.getCardNum () can be called in html; vm is the parent component.

6. Be sure to write the variable name of the parent component with vm.getCardNum ()

When I was developing with vue, I encountered the pop-up page in the background of java and wanted to call the method in my vue component, but the pop-up page in the background was not in my vue component. The methods in vue that other pages wanted to call can only be called in the parent component, so I studied it for a long time. Finally, I decided to pass the function () method in the component to the parent component at the top level, and save the negative component in the variable. Finally, the method is called directly in other pages, and when called, the @ click method cannot be called, because the background page is not inside my vue component, so the call is onclick = vm.getCardNum (). Called like this, vm is the parent component.

This is the end of "how to implement external calls to methods in vue". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.