u013582748
2021-06-25 15:00
采纳率: 100%
浏览 39
已结题

关于vue的methods问题

我有以下的vue的1.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="vue.js"></script>
    <script type="text/javascript">
      window.onload=function() {
          let vm = new Vue({
              el: '#div1',
              data:{
                  name:'aaa',
                  age:17
              },
              methods:{
                  show:function(n){
                      return parseInt(this.age) + n;
                      //alert('Hello vue3');
                  }
              }
          });
      }
    </script>
</head>
<body>
<div id="div1">
    <strong v-bind:title="age+'岁'">name:{{name}}</strong><br><br>
    age:{{age}}<br><br>
     newage:{{show(2)}}<br><br>
   <input type="button" value="test01" v-on:click="show(3)"><br><br>
   <input type="text" name="" value="" v-model="age"><br><br>
   <!--  <input type="text" name="" value="" v-model="name"><br><br>-->
  </div>
  </html>
  </body>

这个程序在按<input type="button" value="test01" v-on:click="show(3)"><br><br>这个按钮没有反应,我想要的结果是按了<input type="button" value="test01" v-on:click="show(3)"><br><br>这个按钮后 newage:{{show(2)}}的newage:变成20,即show:function(n){ return parseInt(this.age) + n; //alert('Hello vue3'); }这个函数的n变成3

  • 好问题 提建议
  • 收藏

5条回答 默认 最新

  • u013582748 2021-06-25 20:03
    已采纳

    我不知道

     computed:{
            newage(){
                return parseInt(this.age)+this.n;
             }
        }
    });这个代码是什么意思?我在我的代码在写了这段代码后(){下面有一段红线
    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • Proud lion 2021-06-25 15:46

    我改了一点你要的效果有了 但是这样写很不对劲呀

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="./vue.js"></script>
        <script type="text/javascript">
            window.onload = function () {
                let vm = new Vue({
                    el: '#div1',
                    data: {
                        name: 'aaa',
                        age: 17,
                        n: 2 
                    },
                    methods: {
                        show: function (n) {
                            this.n = n
                            return parseInt(this.age) + n;
                            //alert('Hello vue3');
                        }
                    }
                });
            }
        </script>
    </head>
    
    <body>
        <div id="div1">
            <strong v-bind:title="age+'岁'">name:{{name}}</strong><br><br>
            age:{{age}}<br><br>
            newage:{{show(n)}}<br><br>
            <input type="button" value="test01" v-on:click="show(3)"><br><br>
            <input type="text" name="" value="" v-model="age"><br><br>
            <!--  <input type="text" name="" value="" v-model="name"><br><br>-->
        </div>
    
    </html>
    </body>
    评论
    解决 无用
    打赏 举报
  • u013582748 2021-06-25 16:05

    我想的是以下这样:我这个程序一运行原来age是17,程序一运行因为newage:{{show(2)}}<br><br>参数是2,所以程序一运行newage:17+2,程序运行结果是newage:19,一但我单击 <input type="button" value="test01" v-on:click="show(3)"><br><br>时,参数就应该变成3了,那么age是17, newage就是newage:17+3,结果应该是newage:20,即newage:20,但程序没有变化

    评论
    解决 无用
    打赏 举报
  • 斯文痞子1 2021-06-25 16:54

    改成题主需要的效果了,不知道是否理解错误

    评论
    解决 无用
    打赏 举报
  • u013582748 2021-09-12 09:27

    这个问题我没有一个采纳,因为我要提最新问题所以不得以采纳一个

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题