• vue 基本介绍


    Vue.js

    Vue是一款优秀的过程开源框架,也是现在WEB工程师必会的一项技能。

    它是一个渐进式的框架,所谓渐进式是指你可以对你的项目代码进行渐进的重构,比如最开始你的项目中所有页面的代码全部是由jQuery构建的,如果想将其重构为Vue的话则可以对某一些页面进行重构,这并不会影响其他页面的正常使用。

    目前Vue3正式版已经出来了,但是新手玩家学习还是从Vue2入手,再递进到Vue3

    安装方式

    CDN引入:

    <!-- 开发环境版本,包含了有帮助的命令行警告 -->
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    
    <!-- 生产环境版本,优化了尺寸和速度 -->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>

    本地引入,下载地址:

    <!-- 官方开发版本 -->
    https://cn.vuejs.org/js/vue.js
    
    <! -- 官方生成版本 -->
    https://cn.vuejs.org/js/vue.min.js
    

    NPM安装:

    # 最新稳定版
    $ npm install vue


    简单体验

    初次上手

    下面是使用Vue打印HELLO,WORLD,通过这个小案例你可以了解Vue的基本使用。

      1. 首先要生成一个Vue实例。
      2. 使用el来挂载元素,可以使用CSS选择器,以及JavaScript的选择器拿到原生DOM元素进行挂载。
      3. 将数据存放至data中。
      4. 使用Vuemustache语法对data中的数据进行渲染,令其展示到被挂载元素模板上。

    注意!HTML以及BODY标签不允许挂载

    <body>
        <div id="app">
            <p>{{ msg }}</p>
        </div>
        <script src="./vue.js"></script>
        <script>
            const app = new Vue({
                el: "#app",
                data: {
                    msg: "HELLO,WORLD",
                }
            })
        </script>
    </body>
     
  • 相关阅读:
    字符串数组和字符串的转换
    项目总结3
    解决几种中文乱码的问题
    ipms的sql语句
    ipms综合管理系统的总结2
    ipms综合管理系统的总结
    简答题汇总
    log4net根据日志类型写入到不同的文件中
    NUnit单元测试初试
    log4net
  • 原文地址:https://www.cnblogs.com/plyc/p/14812391.html
Copyright © 2020-2023  润新知