Vue js页面视图源不可读
提问于 2020-03-13 20:27:53
如何替换组件标记以在view-source中呈现HTML代码？
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="JDhrGe3ZRLyJxubtyNLnjqDEedb70f62Z2S6Y93C">
<title>Laravel</title>
<!-- Fonts -->
<link rel="dns-prefetch" href="//fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
<!-- Styles -->
<link href="http://localhost/laravel_vue/public/css/app.css" rel="stylesheet">
</head>
<body>
<div id="app">
<example-component></example-component> // Need html code here
</div>
<!-- Scripts -->
<script src="http://localhost/laravel_vue/public/js/app.js" defer></script>
</body>
</html>我想显示代表组件标签的Html代码。
回答 2
Stack Overflow用户
发布于 2020-03-13 22:57:01
web浏览器的“查看页面源代码”功能仅显示它从服务器接收的HTML文档的来源。单页应用程序(SPA)大量使用JavaScript来修改DOM，超出了文档最初的少量内容。
我不知道有什么功能可以显示“渲染”的页面源代码，除了以下几点：
- 打开开发工具并使用检查器查看DOM树的当前状态。从这里你可以将
<html>元素的外部超文本标记语言复制到剪贴板上，如果你想解压它的话。 - 有一个View Rendered Source Chrome扩展，它看起来可以做你想做的事情(未经测试)。
Stack Overflow用户
发布于 2020-03-13 23:52:37
尝试使用nuxt，它在构建和提供vue应用程序时提供可读的html文件。你也可以安装网页浏览器的vue devtools，然后点击Ctrl+Shift+J并选择Vue。值得一提的是，vue devtools只能在dev服务器上运行。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60676874
复制相关文章
腾讯云开发者
