Vue打开时界面出现{{message}}的解决方案，亲测有效

网页显示{{message}}的解决方案测试代码<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title></head><body><div id="app">{{message}}</

舟中子

4183人浏览 · 2021-03-16 18:44:13

舟中子 · 2021-03-16 18:44:13 发布

网页显示{{message}}的解决方案

测试代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div id="app">
    {{message}}
</div>

<!--    1.导入Vue.js-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script>
<script>
    let vm = new Vue({
        el:"#app",
        data:{
            message:"hello,vue!"
        }
    });
</script>
</body>
</html>

网页居然显示{{message}} 而不是 hello,vue!

解决方法：
• 确保idea里面下载了node.js
• 导入cnd 的这段代码换成这个（如果你的不是的话）
• <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script>
• 鼠标放在这个链接上，按住Alt+Enter，你会发现，一个Download Library，选中回车，把包下载了就OK了
• 然后再进入网页，问题解决

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^