안녕하세요 늦깍이 개발자 입니다.
강사님 재미있는 강의에 신명나서 잘 듣고 있는 중에 혼자서 해결이 안되는게
있어 여쭈어 봅니다.
Vuex1 사용하는 이유 강의 중 12분29초에 나와 있는
<h4>안녕 {{ $store.state.name }} </h4>
<button @click="$store.state.name = '박'"></button>
처음 로딩할때 안녕 다음 글자가 안 나옵니다. (kim이라는 글자)
버튼 클릭시 "안녕 박"은 잘 나오는데 ㅠ,.ㅠ
개념적으로 바인딩이 안되서 그런거 같은데 어떻게 하면 될는지요?
store.js
import { createStore } from 'vuex'
const store = createStore({
state () {
return {
name : 'kim'
}
},
})
export default store;
main.js
import { createApp } from 'vue'
import App from './App.vue'
import mitt from 'mitt'
let emitter = mitt();
let app = createApp(App)
app.config.globalProperties.emitter = emitter;
import store from './store.js'
app.use(store).mount('#app')
App.vue
<template>
<div>
<div class="header">
<ul class="header-button-left">
Cancel
<ul class="header-button-right">
<li v-if="step1 == 1" @click="step1++">Next
<li v-if="step1 == 2" @click="publish">발행
< img src="./assets/logo.png" class="logo" />
</div>
<h4>안녕 {{ $store.state.name }} </h4>
<button @click="$store.state.name = '박'"></button>
<Container @write="작성한글 = $event" :이미지="이미지" :게시물="게시물" :step1="step1" />
<button @click="more">더보기</button>
<div class="footer">
<ul class="footer-button-plus">
<input @change="upload" accept="image/*" type="file" id="file" class="inputfile" />
<label for="file" class="input-plus">+</label>
</div>
