草庐IT

nodejs_vue

全部标签

在dockerfile中添加nodejs环境

在Dockerfile中通过解压Node.js官方包安装Node.js可以按照以下步骤进行:1.下载Node.js官方包:curl-onode.tar.gzhttps://nodejs.org/dist/v16.14.0/node-v16.14.0-linux-x64.tar.gz  RUNcurl-onode.tar.gzhttps://nodejs.org/dist//node--linux-x64.tar.gz  在``处替换为您希望安装的Node.js版本号,例如`14.17.6`。2.解压Node.js官方包:RUNtar-xzfnode.tar.gz-C/usr/local--st

仓储管理系统(WMS)研发历程-文件上传添加AliyunOSS+VUE前端直接上传

前言由于WMS有很多上传文件的需求,所以这里为了减轻服务器压力选择使用aliyunoss,并且前段直接上传到aliyun进一步减少服务器的压力,因为文件到了服务器会占用带宽,而带宽是生产过程中极其重要的资源之一。首先这里是先安装实战安装命令npminstallali-oss--save显示如下内容则安装表示成功!!!npmWARNdeprecatedconsolidate@0.15.1:Pleaseupgradetoconsolidatev1.0.0+asithasbeenmodernizedwithseverallong-awaitedfixesimplemented.Maintenance

vol-vue框架Cascader 组件多级联动(前端部分)

vol框架官方链接:vol-vue(volcore.xyz);vol框架基于element组件库以及iview组件库进行封装的。vol框架中的Cascader是基于iview组件库中的iview封装的,详细看下方的官方文档。iview官方链接:级联选择器-ViewDesign(iviewui.com)需求:联动的时候有二级数据的时候一级数据不可以选中,但是可以选中一级后面的数据(二级三级甚至更后面的),但是一级下面没有二级数据的话,就可以选中一级的数据。在iview中的cascader组件中封装了一个方法,change-on-select这个方法的值为布尔类型的,为true的时候可以设置为不管

六个高级Vue3知识技巧

Vue3是一个非常流行的前端框架,广泛应用于大型互联网企业和个人项目。虽然我们已经熟悉了一些常见的Vue3知识,但还有一些不太常见但实用性很强的点可以帮助我们进一步优化和提升Vue3应用的性能和开发效率。本文将介绍一些不太常见的Vue3知识点。1.TeleportTeleport是Vue3中不太常见但非常有用的功能。它允许我们在组件内的任何位置渲染内容并将其安装到DOM中的不同位置。 例如,假设我们有一个模态组件,并且希望将其内容渲染到标签下的元素而不是当前组件的父元素。通过Teleport,我们可以轻松实现这个需求。在上面的例子中,我们使用了标签,并通过to属性指定了渲染的目标位置,本例中就

用CScode创建vue前端的环境配置

目录简介Nodejs安装及环境配置下载安装如何用vite创建一个vue项目在cmd下输入命令使用gitee设置私人令牌创建仓库git的安装和环境配置本地克隆仓库提交修改后仓库简介vue官网Vue.js-渐进式JavaScript框架|Vue.jsvite官网Vite中文网Vite是一种具有明确建议的工具,具备合理的默认设置。您可以在功能指南中了解Vite的各种可能性。通过插件,Vite支持与其他框架或工具的集成。如有需要,您可以通过配置部分自定义适应你的项目。Vite还提供了强大的扩展性,可通过其插件API和JavaScriptAPI进行扩展,并提供完整的类型支持。Nodejs安装及环境配置下

Vue 3 的概述以及 ES 6 基本语法的介绍

第1章Vue.js概述本章首先介绍前端架构模式,然后在此基础上介绍Vue及其安装方式,接着介绍Vue3的新特性,最后介绍ECMAScript6(简称ES6)的语法。1.1认识MVC和MVVM模式在学习Vue.js之前,我们先来了解一下MVVM(Model-View-ViewModel,模型-视图-视图模型)模式,它是一种基于前端开发的架构模式。MVVM最早出现于2005年微软推出的基于Windows的用户界面框架WPF,它其实是一种编程设计思想,既然是思想,就不限于在什么平台或者用什么语言开发。基于MVVM的诸多优点,其在当今移动和前端开发中应用得越来越广泛。1.1.1传统的MVC模式如果读者

【Vue3】Vue3 UI 框架 | Element Plus —— 创建并优化表单

安装#NPM$npminstallelement-plus--save//或者(下载慢切换国内镜像)$npminstallelement-plus-S//可以选择性安装lessnpminstalllessless-loader-D//可以选择性配置@自动联想src目录ElementPlus的引入和注入main.tsimport{createApp}from'vue'importAppfrom'./App.vue'import{router}from'./router'//import引入importElementPlusfrom'element-plus'import'element-plus

Vue3中的Ref与Reactive:深入理解响应式编程

前言Vue3是一个功能强大的前端框架,它引入了一些令人兴奋的新特性,其中最引人注目的是ref和reactive。这两个API是Vue3中响应式编程的核心,本文将深入探讨它们的用法和差异。什么是响应式编程?在Vue中,响应式编程是一种使数据与UI保持同步的方式。当数据变化时,UI会自动更新,反之亦然。这种机制大大简化了前端开发,使我们能够专注于数据和用户界面的交互,而不必手动处理DOM更新。Refref是Vue3中的一个简单响应式API,用于创建一个包装基本数据类型的响应式引用(也可以包装复杂类型,只不过底层还是由reactive的方式实现的)。它的主要优点是能够轻松包装基本数据类型,并且具有清

为什么defineProps宏函数不需要从vue中import导入?

前言我们每天写vue代码时都在用defineProps,但是你有没有思考过下面这些问题。为什么defineProps不需要import导入?为什么不能在非setup顶层使用defineProps?defineProps是如何将声明的props自动暴露给模板?举几个例子我们来看几个例子,分别对应上面的几个问题。先来看一个正常的例子,common-child.vue文件代码如下:contentis{{content}}defineProps({content:String,});我们看到在这个正常的例子中没有从任何地方import导入defineProps,直接就可以使用了,并且在template

一文搞懂Vue的MVVM模式与双向绑定

v-model是Vue.js框架中用于实现双向数据绑定的指令。它充分体现了MVVM(Model-View-ViewModel)模式中的双向数据绑定特性。下面我们将详细解释v-model如何体现MVVM和双向绑定:1.MVVM模式MVVM模式是一种软件架构设计模式,它将应用程序分为三个部分:Model(模型):代表应用程序的数据和业务逻辑。View(视图):用户界面,负责数据的展示。ViewModel(视图模型):连接Model和View的桥梁,它负责将Model的数据转换为View可以展示的格式,并处理View的事件,更新Model。2.双向数据绑定双向数据绑定意味着Model的变化会自动更新