Vue.js---------Vue基础

news/2024/7/7 20:06:31
  • 能够说出Vue的概念和作用
  • 能够使用@vue/cli脚手架工程化开发
  • 能够熟练Vue指令

一.vue基本概念

1.学习vue

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。

渐进式javascript框架:https://cn.vuejs.org/

2.web里的渐进式

HTML能写网页,CSS能够让网页好看,JS赋予网页交互效果,JQ写的更快,node可以提供动态数据。

vue里面的渐进式是指:

 

 库和框架

库:封装的属性和方法(jQury)

框架:拥有自己的规则和元素,比库还强大(vue)

Vue是什么?
Vue是一个javascript渐进式框架
什么是渐进式呢?
渐进式就是逐渐使用,集成更多的功能什么是库和框架呢?
库是方法的集合,而框架是一套拥有自己规则的语法

Vue学习方式

传统开发模式:基于html文件开发VUe1

工程化开发模式:在webpack环境中开发vue 

传统的:                                              工程化开发模式:

 

二.@vue/cli脚手架

1.@vue/cli和脚手架介绍

  • @vue/cli是vue贵啊萌发提供的一个全局模块包(得到vue命令),此包用于创建脚手架项目

2._vue/cli安装

全局安装@vue/cli模块包 

查看是否成功


http://lihuaxi.xjx100.cn/news/2144101.html

相关文章

Apache ECharts-数据统计(详解、入门案例)

简介:Apache ECharts 是一款基于 Javascript 的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表。 1、介绍 图 1.1 Apache ECharts 功能、运行环境 功能: ECharts&#xff…

【opencv】教程代码 —Histograms_Matching(2)计算直方图、直方图比较、直方图均衡、模板匹配...

计算直方图直方图比较图像进行直方图均衡化处理模板匹配 1. calcHist_Demo.cpp 计算直方图 这段代码的功能是加载图像,分离图像的三个颜色通道,然后分别计算这三个通道的直方图,绘制出来并显示结果。直方图是图像中像素值分布的图形表示&…

Docker实战教程 第2章 Docker基础

3-1 Docker介绍 什么是Docker 虚拟化,容器 Docker 是一个开源的应用容器引擎,基于 Go 语言 并遵从Apache2.0协议开源。 Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的 Linux 机器上&…

丰诺畅机电科技将莅临2024年第13届生物发酵展

参展企业介绍 无锡丰诺畅机电科技有限公司,是一家分离设备专业制造公司,集开发、设计、制造、销售、服务于一体;具有专业的生产技术,先进的生产工艺,精良的制造设备,完善的检测手段;为满足不同用户的过滤需求&#xf…

三维VR虚拟展馆打破传统展览的时间与空间限制

探索绿色未来,见证生态转型——这是长江经济带在国家发展蓝图中的承诺。如今,通过线上长江经济带发展阶段性成效展厅,这一承诺正以创新的互动体验呈现给公众,彰显了环境保护与经济增长的和谐统一。 深圳VR公司华锐视点精心策划的长…

easyExcel 模版导出 中间数据纵向延伸,并且对指定列进行合并

想要达到的效果 引入maven引用 <dependency><groupId>com.alibaba</groupId><artifactId>easyexcel</artifactId><version>3.2.1</version></dependency> 按照要求创建模版 备注 : 模板注意 用{} 来表示你要用的变量 如果本…

stm32之基本定时器的使用

在上文我们使用到了HAL库的自带的延时函数&#xff0c;HAL_Delay&#xff08;&#xff09;&#xff1b;我们来看一下函数的原型 __weak void HAL_Delay(uint32_t Delay) {uint32_t tickstart HAL_GetTick();uint32_t wait Delay;/* Add a freq to guarantee minimum wait */…

JS实现双向数据绑定的三种方式

1、第一种是通过Proxy数据代理来达到双向绑定的,这是Vue3更新的双向绑定方式。 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Proxy双向绑定</title> <<