Не отображается значение переменной vue?

Question

[Hitinoviy]

Делаю небольшой сайт и почему-то значение переменно errorNode не отображается на странице

<template>
	<div>
		<p class="error">Текущая ошибка: {{ errorNode }}</p>
		<div>
			<h3>{{ info.name }}</h3>
			<input v-if="ifEdited" type="text" @input="insertData($event.target.value)">
    	<ul>
      	<li v-for="(li, i) in info.nodes" :key="i">
					{{ li }}
					<button v-if="ifEdited" @click="deleteNodes(i)">Удалить</button>
					
				</li>
				<div v-if="ifEdited">
						<input @input="addNodeInfo($event.target.value)" type="text">
						<button @click="addNode(newNode)">Добавит узел</button>
					</div>
    	</ul>
			
		</div>
    
		<div>
			<button @click="deleteDevice(i)">Удалить</button>
			<button v-if="!ifEdited" @click="editDevice">Редактировать</button>
			<button v-else @click="editDevice">Сохранить</button>
		</div>
  </div>
</template>


<script>
export default {
	data(){
		return{
			newNode: '',
			errorNode: ''
		}
	},
	props:{
		info:{
			typeof: Object,
			required: true
		},
		index:{
			typeof: Number,
			required: true
		},
		deleteDevice:{
			typeof: Function,
			required: true
		}
	},
	data(){
		return{
			ifEdited: false
		}
	},
	methods:{
		editDevice(){
			this.ifEdited = !this.ifEdited;
		},
		deleteNodes(index){
			this.info.nodes.splice(index, 1)
		},
		insertData(value){
			this.info.name = value
		},
		addNodeInfo(value){
			this.newNode = value
		},
		addNode() {
			if (!this.newNode) {
				this.errorNode = 'Вы не ввели название узла';
				console.log(this.errorNode);
				return false;
			}
	
			this.errorNode = ''; // Сбрасываем сообщение об ошибке
			this.info.nodes.push(this.newNode); // Добавляем новый узел
			this.newNode = ''; // Очищаем поле ввода
		}
	}
}
</script>

<style scoped>

</style>

Answer 1

[modelair]

у тебя data() два раза определена.
надо так:

data() {
    return {
      newNode: '',
      errorNode: '',
      ifEdited: false
    }
  },

Comments

[Hitinoviy]

спасибо, я слепой