여기의 핵심은 $nextTick이며, 이 적응형 함수는 페이지가 렌더링된 후에 실행됩니다.

2) 창이 변경될 때 적응

window . addevent 리스너(" resize ", this . resizethechart); //이것은 프레임

in method:

resizeTheChart() {

if (this . $ refs & amp& amp this. $ refs.echarts1) {

this. $ refs . echarts 1 . resize();

}

여기서 적응형 기능 모니터가 창에 추가됩니다. 이를 통해 화면 크기가 변경되면 캔버스도 변경됩니다.

요약

인터넷에 나와 있는 적응형 솔루션들은 모두 윈도우 적응형 문제만 해결해 주는데, 사실 윈도우 적응형 문제는 해결이 가능하지만 처음 렌더링할 때 적응이 되지 않는 문제가 발생하는데, 다음Tick은 이 문제를 해결합니다.

확인 후 다운로드한 뷰-에차트의 기본 크기는 600px*400px이며, 바깥쪽 상자가 이보다 작으면 이를 초과합니다. 이 적응형 함수 자체는 이 문제를 해결하지만 비동기식인 것 같습니다. 마운트된 상태에서 한 번만 작성하면 캔버스가 생성되기 전에 한 번만 실행되어 원하는 효과를 얻지 못합니다.