vue 中双大括号里显示变量名不显示值

最新推荐文章于 2024-09-11 02:20:32 发布

卿·静

最新推荐文章于 2024-09-11 02:20:32 发布

阅读量3.1k

点赞数 7

分类专栏：前端文章标签： vue.js 前端

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/apowers/article/details/123058716

版权

前端专栏收录该内容

17 篇文章

订阅专栏

原代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script src="../js/vue.js"></script>
<script>
    const app = new Vue({
        el:"#first",
        data:{
            message:"Hello Word!"
        }
    })
</script>
<body>
    <div id="first">{{message}}</div>
</body>
</html>

运行结果：

解决问题：

1.首先，我们需确保html中与vue.js相关联：

<script src="../js/vue.js"></script>

vue.js可前往官网下载安装 — Vue.js (vuejs.org)

2.实现的vue实例需在div代码之后，如果在div代码之前，vue实例找不到id为first的内容，从而里面的数据data不能传到双大括号之中，修改如下：

运行结果：

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

打赏作者

卿·静 你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20

扫码支付：¥1

获取中

扫码支付

您的余额不足，请更换扫码支付或充值

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。