vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > 在浏览器console调用vue内部方法

在浏览器console中如何调用vue内部方法

作者:茶荼

这篇文章主要介绍了在浏览器console中如何调用vue内部方法,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

在浏览器console调用vue内部方法

new Vue({
  el: '#app',
  i18n,
  store,
  router,
  data () {
    return {
      address:''
    }
  },
  components: {App},
  template: '<App/>',
  mounted () {
    window.vue = this
  },
  methods:{
    updateAdress(address){
      console.log(address)
    }
  }
})

在main.js中设置

mounted(){window.vue = this}

即可在console.log中调用

vue.updateAdress(123) //123

vue调试--使用console输出

用示例介绍使用浏览器的console调试vue的方法。

输出对象数据

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>this is title</title>
</head>
<body>
<div id="app">
    {{message}}
</div>
<script src="js/vue.js"></script>
<script>
    let vm = new Vue({
        el: '#app',
        data: {
            message: 'Hello Vue!'
        }
    })
</script>
</body>
</html>

结果

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:
阅读全文