<tr v-for="d in data2">
<td>{{d.bno}}</td>
<td>{{d.writer}}</td>
<td>{{d.title}}/{{typeof d.title}}</td>
<td>{{d.regdata}}</td>
<td>{{d.viewcnt}}</td>
---------------------------------------
<div id="app" class="row justify-content-md-center" style="margin-left:50px;">
<button v-on:click="fetchData">get data</button>
<table class="table" style="width:100%;">
<thead>
<th>글번호</th>
<th>작성자</th>
<th>제목</th>
<th>작성날짜</th>
<th>조회수</th>
</tr>
</thead>
<tbody>
<tr v-for="d in data2">
<td>{{d.bno}}</td>
<td>{{d.writer}}</td>
<td>{{d.title.length}}</td>
<td>{{d.regdate}}</td>
<td>{{d.viewcnt}}</td>
</tr>
</tbody>
</table>
</div>
<script>
const a = new Vue({
el:'#app',
data:{
data2:"11"
}
,methods:{
fetchData1:function(){
this.data2="22";
},
fetchData:function(){
axios.post("/spring_practice_02/board/all")
.then(function(res){
//alert(res.data[0].writer.length);
a.data2 = res.data;
});
},
titleStr:function(str){
return str.length;
}
}
})
</script>
d title이 null이거나 undefined일때가 있나봐. 네트워크로 안에 뭐 들어있나 제대로 봐 - dc App
뺨한대 올리기 전에 소스를 올려
뷰 관련 소스는 이렇게 됨
console.log(res.data) 찍어서 콘솔창 캡쳐 ㄱ 그리고 이왕이면 vue 버전 갈아타고 composition api 를 쓰는게 어떻겠니?
너무 길어서 다 못 올리는데
다 string인건 맞아
컴파일 에러 같은데 감 잡히는거 없어??
딱 느낌 오는데 데이터 받아오는 버튼 누르기 전에 에러가 나있을듯
data2 초기값을 string으로 넣었고 dom은 데이터를 받기 전엔 그 초기값에 바인딩 됐으니
맞아 화면에 아무것도 안뜨고 저 에러 화면만 뜨는데(글 수정해서 에러화면 추가함)
data2: [] 로 하고 length 써봐 에러 안날거임 데이터가 정상이라면…
오 됐다, 답변 감사~
너같은 애들은 꼭 타입스크립트 써라 그게 정신건강에 좋을거다