vue --- ref属性获取dom元素和子组件的方法
生活随笔
收集整理的這篇文章主要介紹了
vue --- ref属性获取dom元素和子组件的方法
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
說明:
總體代碼如下
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><script src="../../node_modules/vue/dist/vue.js"></script><link rel="stylesheet" href="../../node_modules/bootstrap/dist/css/bootstrap.css"><style></style> </head><body><div id="app"><input type="button" value="獲取元素" @click="getElement" ref="myBtn"><h3 ref="myh3">rel = "myh3"</h3><hr><login ref="myLogin"></login></div><template id="tmp1"><h1>登錄</h1></template><script>var login = {template: '#tmp1',data() {return {msg: 'son msg'}},methods: {show() {console.log("調用子組件的方法");}}}const vm = new Vue({el: '#app',data: {},methods: {getElement() {console.log(this.$refs.myLogin.msg);this.$refs.myLogin.show();}},components: {'login': login}})</script> </body></html>總結
以上是生活随笔為你收集整理的vue --- ref属性获取dom元素和子组件的方法的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 乐优商城笔记
- 下一篇： webpack --- 使用vue