在这个带有硬编码 url 的简单示例中,我的 Vue.js 组件未渲染,纯 html 被渲染,但我有组件的所有位置都显示为空白。
Phantomjs 应该能与 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>
检查你的 phantomjs 版本。 Phantomjs 2.x 版可以很好地与 vuejs 配合使用。
phantomjs 可能运行得太快,以至于当元素到达该部分代码时尚不可用。在尝试访问元素之前,使用 waitForElement 或 wait 来引发延迟。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)