vue-cli3 + vuetify + electron のタスク管理にて未知の挙動

vue
1<template>
2  <v-container>
3    <v-row justify="center">
4      <v-col cols="8" class="mt-10">
5        <v-row justify="center">
6          <v-col>
7            <v-slider
8              v-model="time"
9              min="1"
10              max="24"
11              label="1日の作業時間"
12              thumb-label/>
13            
14            <v-row justify="center" align="center">
15              <v-text-field 
16                v-model="task.text"
17                label="タスク"/>
18              <v-radio-group v-model="task.times" :mandatory="false">
19                <v-radio label="10分" value="time10"/>
20                <v-radio label="30分" value="time30"/>
21                <v-radio label="60分" value="time60"/>
22              </v-radio-group>
23              <v-btn class="ml-4" small @click="submit()">追加</v-btn>
24            </v-row>
25
26            <v-list>
27              <v-list-item
28                v-for="(item,index) in taskArr"
29                :key="index"
30              >
31                <v-list-item-content>
32                  <v-list-item-title v-text="item.item.text"/>
33                </v-list-item-content>
34              </v-list-item>
35            </v-list>
36          </v-col>
37        </v-row>
38      </v-col>
39    </v-row>
40  </v-container>
41</template>
42
43<script>
44  export default {
45    name: 'HelloWorld',
46
47    data: () => ({
48      time: 8,
49      task:{
50        text:'',
51        times:0,
52      },
53      taskArr:[],
54    }),
55    methods:{
56      submit(){
57        this.taskArr.push(this.task)
58      }
59    }
60  }
61</script>
62

pushされたthis.taskがv-modelにより連動され続けます。
pushされた時点で連動を切りたいのですが方法はないのですか？

行動規範の内容に同意します

回答1件

自己解決

vue
1      submit(){
2        const task = {
3          text: this.task.text,
4          time: this.task.times
5        }
6        this.tasks.push(task)
7      }

投稿2020/03/01 11:34

Tsubasa_OR

総合スコア23