Vue.js在嘗試使用Phantom.js生成PDF時不渲染

在這個帶有硬編碼url的簡單示例中，我的Vue.js組件不是渲染，而是渲染了純html，但是所有我有組件的地方都顯示爲空白。Vue.js在嘗試使用Phantom.js生成PDF時不渲染

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>

來源

2017-03-01 marceloch2

對於那些想要嘗試的人，只需安裝phantom.js並創建一個ex：text.js並在終端中調用。 phantomjs test.js – marceloch2

我也有vuejs和wkhtmltopdf的問題。 – Nick

@尼克我相信，如果你改變服務器端渲染你的VUE將正常工作與PDF一代。在我的情況下，我現在不能改變ssr。如果可能的話，我幾乎可以確定你的PDF文件可以工作。 – marceloch2

檢查您的phantomjs版本。 Phantomjs版本2.x將與vuejs一起工作得很好。

phantomjs可能運行得太快，以至於當元素到達代碼的那部分時，該元素還不可用。使用waitForElement或等待嘗試訪問元素之前引發延遲。

來源

2017-03-25 06:16:19 Jewel

嗨@Jewel謝謝。但嘗試了很少的方法，[鏈接]（http://stackoverflow.com/questions/16807212/how-to-wait-for-element-visibility-in-phantomjs#19070446）。但沒有運氣，相同的結果。 – marceloch2

Vue.js在嘗試使用Phantom.js生成PDF時不渲染

回答

相關問題