

テキストに文字を打ちボタンをクリックすると、配列に追加されるようにしたいです。今あるコードですと、テキストに入力した文字が、add
function()のpush()の中で追加ができていません。ここで追加するやり方を教えていただきたいです。

[code]

    <!DOCTYPE html>
    <html>
    
    <head>
        <meta charset="UTF-8">
        <title>
            sample
        </title>
        <link rel="stylesheet" href="style.css">
        
        <script src="https://gstatic.com/charts/loader.js"></script><!--　type="text/javascript" はなくても動く？-->
        
    </head>
    
    <body>
        <h3>好きなプログラミング言語投票</h3>
        <div id="chart_div" style="height: 500px;"></div>
        <div id="app">
            <li v-for="(item,c) in dataArray" v-if="c>0">{{item[0]}} : {{item[1]}}
                <button v-on:click="addOne(c)"> 一票</button>
            </li>
            <li><input type="text" v-model="myText" size="5"> <button v-on:click="add">追加</button></li>
        
     
        </div>
    
        <script>
            //グラフに使うデータ
            var orgdata = [
                ['言語', '票数'],
                ['Java', 1], ['C', 1]
            ];
    
            google.charts.load('current', { packages: ['corechart']});
            google.charts.setOnLoadCallback(drawBasic);
    
    
    
            //グラフを表示数関数
            function drawBasic() {
                var data = google.visualization.arrayToDataTable(orgdata);
                var options = {title: '好きなプログラミング言語',"is3D": true};
                var chart = new google.visualization.ColumnChart(
                        document.getElementById('chart_div'));
                    chart.draw(data, options);
                }
    </script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
    <script>
        new Vue({
            el:"#app",
            data:{
                dataArray:orgdata,
                myText:""
            },
            methods:{
                addOne: function(val){
                    var obj = this.dataArray[val];
                    obj[1]++;
                    this.dataArray.splice(val,1,obj);
                    drawBasic();
                },add: function () {//配列に追加するときのメソッド
                        this.orgdata.push([this.myText,1]);//TODO
                }
    
    
                    
            }
        });
    </script>
    </body>
    
    </html>
    
[/code]


CC BY-SA 4.0
2021-06-08T05:16:31.930
77405
2021-06-08T06:38:21.070
41769
question
vue.js
vue.jsでの配列への要素の追加方法


当該インスタンスにデータ、`this.orgdata`は存在しないように見えます。`this.dataArray`の誤りであったりしませんか？  
またブラウザのコンソールにエラーが出ていませんか？


CC BY-SA 4.0
2021-06-08T06:38:21.070
77408
2021-06-08T06:38:21.070
2376
77405
answer