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时不渲染

回答

相关问题