Windows 10(64)
"vue": "^2.6.10",
"vuetify": "^2.1.0",
"vue-cli": "3.11.0",
"node":"v11.13.0"
About 4 months of programming experience
I am creating a todo app with vuetify+vue-cli.URL
After registering more than one class name (task), fill in the memo (form), and when you load the page, everything will be rewritten to what you entered later.
上 Enter a note in the economics above
➁When I load the page...
下 The contents of the memo are reflected in the task (sports science) below.
Count.vue
@@-11,7+11,7@@
<v-card card_id max-width="344" class="mx-auto">
<v-card-title>{{todo.name}}</v-card-title>
<v-card-text>
+ <Field of >
</v-card-text>
<v-card-actions>
<v-btn@click="increment(todo)" color="primary">Number of skips</v-btn>
<span>{{todo.count}}</span>
<v-btn@click="decrement(todo)" color="error"> Wrong (-)</v-btn>
<v-btn@click="deleteItem(index)">Delete</v-btn>
</v-card-actions>
</v-card>
</div>
</v-container>
</v-content>
</v-app>
</template>
<script>
+ import Field from "./Field";
export default {
data(){
US>return{
count —0,
name: '' ,
todos: [ ]
};
},
+ components: {
+ field
+ },
mounted() {
This.todos=JSON.parse(localStorage.getItem("todos")")||[];
},
methods: {
addTo(){
Field.vue↓
<template>
<v-text-field label="note" v-model="memo">/v-text-field>
</template>
<script>
export default {
data(){
US>return{
US>"memo:"
};
},
mounted() {
if(localStorage.memo)this.memo=localStorage.memo;
},
watch: {
memo(newMemo){
localStorage.memo = newMemo;
}
}
};
</script>
What should I do to solve this problem?Also, do you have the necessary knowledge to solve this problem?Or can't we solve this problem?
I'm sorry for the poor question, but please reply.
The first question I had was to separate it into Field.vue, but how about putting it down for each person and managing it with vuex?In that case, I think we will save each value as state instead of data to local storage or DB.
© 2024 OneMinuteCode. All rights reserved.