반응형
팬텀을 사용하여 PDF를 생성하려고 하면 Vue.js가 렌더링되지 않습니다.js
하드코드된 url my Vue.js 컴포넌트가 렌더링되지 않은 이 간단한 예에서는 플레인 html이 렌더링되지만 컴포넌트가 있는 모든 장소는 공백으로 표시됩니다.
Phantom.js는 Vue.js에서 정상적으로 동작합니다.
var webPage = require('webpage');
var page = webPage.create();
page.viewportSize = { width: 1920, height: 1080 };
page.open("-----------", function start(status) {
page.render('test.jpeg', {format: 'jpeg', quality: '100'});
phantom.exit();
});
도움을 주고 테스트를 수행할 사용자를 위한 빠른 vue 코드입니다.
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/vue/latest/vue.js" charset="utf-8"></script>
<style media="screen"> body { background-color: grey; } </style>
</head>
<body>
plain text before vue
<div id="app" v-text="title" />
plain text after vue
<script type="text/javascript">
const app = new Vue({ el : '#app', data () { return { title : 'Vue Title' } } });
</script>
</body>
</html>
pantomjs 버전을 확인합니다.Phantomjs 버전 2.x는 vuejs에서 정상적으로 동작합니다.
pantomjs가 너무 빨리 실행되어 코드의 해당 부분에 도달했을 때 요소를 아직 사용할 수 없을 수 있습니다.waitForElement를 사용하거나 요소에 액세스하기 전에 지연을 유도합니다.
언급URL : https://stackoverflow.com/questions/42537570/vue-js-not-rendering-when-trying-to-generate-a-pdf-using-phantom-js
반응형
'programing' 카테고리의 다른 글
| Vuex - 네임스페이스 + mapMutations + 함수? (0) | 2022.07.16 |
|---|---|
| Java에서 사용자 정의 예외를 만드는 방법 (0) | 2022.07.16 |
| Vuex - 어떤 데이터가 스토어를 통해 전송되어야 합니까? (0) | 2022.07.16 |
| 페이지 새로고침 시에도 SPA 전체에서 데이터를 유지하는 방법 (0) | 2022.07.16 |
| Prepared Statement의 SQL을 입수하려면 어떻게 해야 합니까? (0) | 2022.07.16 |