购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

3.3.3 方法之间的调用

在Vue中,methods选项中的一个方法可以调用methods中的另外一个方法,使用以下语法格式:

    this.$options.methods.+方法名

【例3.6】方法之间的调用(源代码\ch03\3.6.html)。

    <div id="app">
       {{content}}
       {{way2()}}
     </div>
    <!--引入vue文件-->
    <script src="https://unpkg.com/vue@next"></script>
    <script>
        //创建一个应用程序实例
       const vm= Vue.createApp({
           //该函数返回数据对象
           data(){
             return{
                 content:"苹果"
              }
           },
            //在选项对象的methods属性中定义方法
           methods: {
               way1:function(){
                   alert("今日苹果的秒杀价是8.68元每公斤!");
               },
               way2:function(){
                   this.$options.methods.way1();
               }
            }
         //在指定的DOM元素上装载应用程序实例的根组件
         }).mount('#app');
    </script>

在谷歌浏览器中运行程序,结果如图3-7所示。

图3-7 方法之间的调用 D+dyiuztFVdEHZZpEhd1wVzKpkMDPQ3ia9IVIs19oKF6dA/gX4hVvceBl0S4X3uj

点击中间区域
呼出菜单
上一章
目录
下一章
×