Vue.js核心技术解析与uni-app跨平台实战开发学习笔记 第12章 Vue3.X新特性解析 12.1 Vue3.0 新特性

news/2024/5/18 21:08:43/文章来源:https://blog.csdn.net/weixin_44226181/article/details/126617659

Vue.js核心技术解析与uni-app跨平台实战开发学习笔记

文章目录

      • Vue.js核心技术解析与uni-app跨平台实战开发学习笔记
      • 第12章 Vue3.X新特性解析
        • 12.1 Vue3.0 新特性

第12章 Vue3.X新特性解析

12.1 Vue3.0 新特性

Vue3.0 中需要重点关注的两个新特性:

  • 双向数据绑定的原理发生了改变。Vue2.0中使用es6中的Object.dedineProperty数据劫持原理实现,而在3.0中使用的是Proxy代理实现双向数据绑定,使用代理形式渲染速度更快。
  • 新增组合式API(Composition API)。在Vue3.0中这很重要。

Vue3.0项目通常也是采用vue-cli进行搭建。

使用vue-cli创建项目的步骤:

  1. 打开控制台,进入站点根目录。

    在这里插入图片描述

  2. 运行命令

    vue create project name
    

    在这里插入图片描述

  3. 选择Manually select features手动自定义安装(上面两个是vue2和vue3的默认安装)

在这里插入图片描述

  1. 手动安装模块。

    接下来是自定义模块选择窗口,在此窗口中可以选择Vue版本以及其他各种选项。

    其中Vue版本、Babel、Router是必须要选择的。

    在这里插入图片描述

    使用空格键进行选择,Enter确定

  2. 选择Vue版本

    在这里插入图片描述

    在这里插入图片描述

    选择3.x

    在这里插入图片描述

    在这里插入图片描述

    在这里插入图片描述

    在这里插入图片描述

    等待项目构建完成

  3. 运行项目

    npm run serve
    

    在这里插入图片描述

    在这里插入图片描述

    使用浏览器访问:

    在这里插入图片描述

    OK。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_3408.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

JVM资料阅读笔记总结-1

前言 最近读周志明的《深入理解Java虚拟机》以及半栈工程师的Java虚拟机文章,对JVM又重新复习了一遍,每次看后收获都不一样(因为没有debug能力,还是很懵懂),担心会忘记将自己读后总结记录下来 总结内容 j…

期货开户止损是通向成功的保障

一、情绪波动止损法: 如果买入股票后,感觉不好,寝食难安,这说明自己认为买入理由不充分或信心不足,这将影响今后的正常操作,故应果断卖出离场。 二、空间位移止损法: 1、 初始止损法&#xf…

调用MapReuce对文件中各单词出现次数统计

调用MapReduce对文件中各单词出现次数统计 调用MapReuce对文件中各单词出现次数统计一、安装环境二、需求分析 1.创建hadoop账户2.设置Hadoop密码3.为Hadoop用户增加管理员权限4.更新apt5.安装vim6.安装SSH、配置SSH无密码登陆 三、安装java环境 1.安装JDK2.验证JDK安装情况3.…

SpringBoot 启用 GZIP 对响应进行压缩

SpringBoot Web 应用默认是不启用响应数据的压缩,对大的文本类型的响应数据进行压缩是十分必要的,如 JSON, XML 等应用数据,甚至是 JS, CSS 等。 早先的 Web 应用基本是要配置一个叫做 GzipFilter 之类的东西,然后判断请求的 Acc…

Windows与网络基础-1-2-虚拟机安装Windows10和window server2016

目录 一、虚拟机安装软件和ios镜像文件 二、新建虚拟机 2.1 文件—>新建虚拟机 2.2 选择典型安装 2.3 选择稍后安装 2.4 选择操作系统类型和版本 2.5 虚拟机名称和安装路径 2.6 指定磁盘大小 2.7 配置硬件信息 2.8 进入系统安装界面 2.9 选择系统版本 2.10 选择自…

LeetCode精选200道--二叉树篇(二)

二叉树篇(二)前言完全二叉树的节点个数普通二叉树逻辑递归完全二叉树逻辑平衡二叉树题外话递归二叉树的所有路径思路递归相同的树100. 相同的树另一棵树的子树左叶子之和思路找树左下角的值思路112. 路径总和思路106. 从中序与后序遍历序列构造二叉树根据…

FLASH:一种高效的Transformer设计

背景 近年来,Transformer凭借其优秀的设计,在文本、图像、语音等方向大杀四方。但是由于其attention的二次复杂度限制了其在长序列上的应用。本文提出了一种快(速度快)、省(省显存)的模型FLASH(Fast Linear Attention with a Single Head),在…

SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解

一、前言 主要通过SpringBoot和Vue来实现一个前后端分离的在线工具平台,包含PDF转换、图片处理、文本处理、图表展示、二维码工具等功能。 为了更直观展示项目效果,也给大家提供了在线体验地址:http://49.234.28.149, 源码资源见文末。 通过…

org.apache.ibatis.binding.BindingException: Invalid bound statement (not found):

org.apache.ibatis.binding.BindingException: Invalid bound statement (not found): 无效的绑定语句(未找到),就是写的sql 方法找不到sql。解决: 1 namespace 指向是否正确 路径与引用的方法的路径保持一致a.namespace 没有指向Dao b. id ,方法名没有对应上2 引用的方法…

记录Kettle连不上mysql8

如图所示,mysql升级到8了。 在很早之前,我一直用的是Mysql 5的驱动包去连接数据库,今天发现突然连接不上了,想了一下,应该是我以前升级mysql后的原因,换了mysql8的驱动后依旧没个卵用。 报错如下&#xff…

远程Debug远端服务器JVM配置

远程调试非本机的Java进程 远端Java进程启动的JVM参数 注意:以下配置尽量不要在线上生产环境开启,或者 JDK4: -Xdebug -Xrunjdwp:transportdt_socket,servery,suspendn,address{port} JDK5-JDK8: -agentlib:jdwptransportdt_socket,servery,suspen…

Python——LeetCode刷题——【383. 赎金信】

题目描述: 解题思路: 用字典记录字符串magazine中每个字符出现的次数。然后看看字典中magazine的各个字符的出现次数是否“够”字符串ransomNote中各个字符出现的次数。如果够,return True。如果存在有点字符不够,return False。…

学习:Python进阶 冒泡排序

#原理 列表每两个相邻的数,如果前面的数比后面的数大,则交换这两个数 一趟排序完成后,则无序曲减少一个数,有序区增加一个数 每循环一趟,从无序区冒出来一个最大的数,放入有序区,最终得到一个升序的列表

认真研究ConcurrentHashMap中的元素统计策略

这里我们想研究的是jdk1.8中ConcurrentHashMap的addCount(long x, int check)方法。如下所示在put方法的最后会触发addCount(long x, int check)方法进行元素个数的统计。 我们再回顾一下另一个参数binCount : 在操作链表的分支if (fh > 0)中 用于统计put前链表…

TinyRenderer学习笔记--Lesson 3、4

Lesson 3 zbuffer 无论怎样,生活中的显示器基本上都是平面,是一个2D的场景,而我们的模型却是3D的,是有深度的,实际上我们看见的都只是离我们的眼睛最近的那一个平面,一个不透明的3D物体的内部和背面是我们…

河北稳控科技使用标准信号检测 VM振弦采集模块测量精度

河北稳控科技使用标准信号检测 VM振弦采集模块测量精度(一) (1)电源1.1VDD 引脚电源必须使用 LDO 稳压或者低纹波线性电源, LDO 推荐使用 AM1117_3.3V 芯片,测试时发现 SPX 生产的 LDO会造成非常严重的干扰(其它品牌应该也会有类似的问题)。1.2VSEN 引脚电源单通道模块…

阿里、滴滴、华为等一线互联网分布式消息中间件:RocketMQ核心笔记

本篇介绍了RocketMQ的基本使用方法及其各个组件的基本原理,讲解原理时,都是采用先整体架构后详细分解的方式。详细分解时不会深入源码逐段讲,而是从代码结构出发梳理整个运行过程。 这份RocketMQ分布式消息中间件—核心原理与最佳实践的完整…

Android Studio应用基础,手把手教你从入门到精通(小白学习)总结2 之 常用界面布局和ListView

总结1链接: (156条消息) Android Studio应用基础,手把手教你从入门到精通(小白学习)总结1_好喜欢吃红柚子的博客-CSDN博客 学习视频链接: (学完必会)Android studio基础,从入门到…

尚好房 07_前端房源展示

尚好房&#xff1a;前端房源展示 一、分页显示房源列表 1、效果 2、项目搭建 2.1 创建项目 在web项目中创建子工程web-front 2.2 pom.xml <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0&…

stm32学习(二)|ADC电压采集DMA

利用ADC通道采集外部传感器数值,ADC通道选择依据实际查询芯片手册可得,相关配置利用Cubemx完成。 ADC参数配置首先选择需要使用的ADC通道,并设置对应的引脚ADC_IN0X.ADC参数设置(Paremeter setting)Mode : Independent mode,只使用一个ADC通道 Clock Prescaler,Resolut…