vue+nodejs框架学习1-项目搭建

最新推荐文章于 2025-09-11 16:47:32 发布

原创

最新推荐文章于 2025-09-11 16:47:32 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了如何使用Vue框架进行项目搭建，重点讲解了Vue的数据驱动原理和组件化思想，并详细阐述了从安装Node.js、设置cnpm镜像到使用vue-cli初始化项目的步骤，包括是否选择安装vue-router、ESLint等选项。

vue框架
MV*
Model和View绑定，数据驱动，状态管理，组件化
数据驱动：传统的jQuery需要获取DOM节点，通过click事件或者addclass改变DOM节点的内容,DOM和JS是耦合的。vue不关注怎么获取DOM节点，改变DOM节点，只关注怎么将数据放在data里面。
组件化：公共部分抽离出来，可以放到任何一个界面使用。
通过MVVM的数据绑定实现自动同步。
Object.defineProperty()函数模拟双向数据绑定

<body>
<input type="text" id="userName">
<br>
<span id="uName"></span>
</body>
<script>
    var obj = {};
    Object.defineProperty(obj,"userName",{
        value:"Jack"
    });
    document.getElementById("userName").addEventListener("keyup",function (event) {
        // event是一个鼠标事件对象
        document.getElementById("uName").innerText = event.target.value;
    })
</script>
//-------------------自动触发---------------------------------
 Object.defineProperty(obj,"userName",{
        get: function () {
            console.log("get init ");
        },
        set: function (val) {
            console.log("set init ");
            document.getElementById("uName").innerT

最低0.47元/天解锁文章