
Vue
文章平均质量分 57
Vue
舌尖上的蛋炒饭
持续学习是一个人的自我修养,你的行为方式为人处事潜移默化的被书中的人或事影响。在自己的身上不断演绎着忒修斯之船悖论,才是保持思考与年轻的关键。世界纷繁复杂,社会花花绿绿,每个人都在时间中奔跑啊,记得偶尔停下来,生活不止有短视频不止有游戏不止有工作,除了是一个看客一个player一个员工,还是父母的儿子是妻子的丈夫也是一个可以独立思考的人。
展开
-
Vue之router和vuex
在学习之前,我们可以先安装一个插件,是一个浏览器插件,这个插件的作用是可以让我们更好的观察到数据的变化和状态的变更他是一个github的链接,如果你没办法科学上网的话,也可以在上面这个链接下载后安装,安装就不讲了吧对于router和vuex的安装,可以在创建项目的时候安装,也可以后续再加插件,比较无脑的办法就是启动cmd,启动vue的ui管理vue ui然后搜索安装即可安装完成后会有这两个文件夹我们先来看一下这两个文件再来看store/index.js。原创 2023-07-07 17:37:30 · 922 阅读 · 1 评论 -
Vue核心语法
我们以前都是用的框架来搭建的,省去了很多内容,今天我们从原始的方式来使用vue,下面是下载地址。原创 2023-07-04 16:21:06 · 388 阅读 · 1 评论 -
Vue脚手架开发入门
略过后续使用的项目就是新搭建的一个项目。原创 2023-07-04 18:42:10 · 267 阅读 · 0 评论 -
Vue项目部署到jenkins上
Vue项目部署到jenkins上服务器配置环境需要安装yarn命令,但是yarn是通过npm安装的,所以要先安装npm,npm又是node附带的,所以要安装node[root@hecs-82454 local]# pwd/usr/local[root@hecs-82454 local]# wget https://nodejs.org/dist/v14.15.4/node-v14.15.4-linux-x64.tar.xz[root@hecs-82454 local]# tar -xf node原创 2022-02-16 10:38:57 · 989 阅读 · 0 评论 -
拿到一个别人的vue项目该怎么做
拿到一个别人的vue项目该怎么做下载代码到本地git clone https://gitlab.xxx.git安装cnpmsudo npm install -g cnpm --registry=https://registry.npm.taobao.org安装vue-clinpm uninstall -g @vue/clinpm install -g @vue/cli@3.11.0查看安装版本vue -V安装依赖npm install下载的就是vue项目的package.j原创 2022-02-14 15:14:09 · 1435 阅读 · 0 评论 -
NGINX部署vue+springboot项目
NGINX部署vue+springboot项目部署Vue首先将vue打包出来的dist文件放到nginx/html下,不是将整个文件夹放进去,而是将文件内的文件放进去[root@hecs-82454 html]# ls50x.html css favicon.ico fonts index.html js然后修改配置文件nginx/conf/nginx.conf...原创 2021-09-07 10:29:21 · 3224 阅读 · 2 评论 -
Vue项目打包后如何在本地运行
Vue项目打包后如何在本地运行+We’re sorry but new doesn’t work properly without JavaScript enabled. Please enableVue打包之后如果在服务器上运行的话我们是需要tomcat的,但是如果我们在自己本地运行,那就需要借助serve来实现安装npm install -g serve启动serve -s dist -p 3000推荐使用nohup命令保持启动,即使命令行关闭,服务的运行也不会受到影响nohup s原创 2021-08-19 16:25:45 · 1788 阅读 · 0 评论 -
Vue引入的ElementUi没有样式怎么办
Vue引入的ElementUi没有样式怎么办就像我的项目,明明按照官网的操作,全部引入了import Vue from 'vue';import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';import App from './App.vue';Vue.use(ElementUI);new Vue({ el: '#app', render: h => h(App)});原创 2021-08-19 16:01:52 · 8517 阅读 · 2 评论 -
Vue入门8、vue脚手架创建项目的打包+Rule can only have one resource source (provided resource and test + include)
Vue入门8、vue脚手架创建项目的打包之前看教程一直以为vue打包需要webpack命令来打包,但是今天经过和前端的沟通后知道,其实脚手架创建的项目是内置了webpack的,我们可以不用下载webpack-cli来打包项目npm run build直接使用上面的这个命令即可打包成功,打包完成后会生成一个dist文件夹...原创 2021-08-19 15:38:11 · 3453 阅读 · 0 评论 -
Vue入门7、axios带参数请求+渲染后端返回接口数据
Vue入门7、参数传递+axios带参数请求参数传递axios带参数请求原创 2021-08-18 11:00:09 · 821 阅读 · 0 评论 -
Vue入门6、插槽(自定义分发)+router-view+重定向+嵌套路由
Vue入门6、插槽(自定义分发)+router-view+重定向+嵌套路由项目沿用Vue入门5的项目,/views/Four.vue插槽(自定义分发)我们先来想想一个场景我们的和标签里的内容是从服务器里来的,不想写死<template><div class="four"> <h1>hello</h1> <el-row> <!--将函数绑定在了一个按钮上--> <el-button type="原创 2021-08-18 09:39:03 · 1420 阅读 · 0 评论 -
Vue入门5、生命周期+计算属性+method
Vue入门5、生命周期+计算属性+插槽(自定义分发)+自定义事件+router-view+重定向老规矩1、新建views/Four.vue<template><div class="four"> <h1>hello</h1></div></template><script>export default { name: 'Four'}</script><style>原创 2021-08-17 12:34:34 · 425 阅读 · 0 评论 -
Vue入门4、组件component+视图view+路由+ElementUI+EsLint报错好烦+router-link+template只能有一个根节点+props
Vue入门4、组件compent+视图view+计算属性+生命周期+路由我们先新建一个项目1、vue ui 打开创建项目页面2、3、4、修改一下,ESlint选择standard,要不然校验太多了5、删除掉这两个views6、删掉App.vue里的两个路由7、删除掉router/index.js里的两个页面的路由信息和import信息8、删除components下面的组件9、npm run serve启动项目就是一个空白的项目了ElementUI下载element原创 2021-08-16 18:17:59 · 2302 阅读 · 0 评论 -
Vue入门3、MVVM+虚拟DOM+绑定+基本语法+如何在console里调用vue组件属性+双向绑定
Vue入门3、MVVM+虚拟DOM+绑定+如何在console里调用vue组件属性+双向绑定MVVM我们直接从网上找来一张图需要注意的是,ViewModel所封装出来的数据模型包括视图和行为两部分,而Model层的数据模型只包含状态,比如:页面的这一块展示什么,那一块展示什么,这些都是与试视图状态(展示)试图家在进来时发生什么,点击这一块发生什么,这一块滚动时发生什么,这些都属于视图行为(交互)视图行为和状态都封装在了ViewModel里,这样的封装使得ViewModel可以完整的去描述Vie原创 2021-08-12 12:31:26 · 871 阅读 · 0 评论 -
Vue入门2+与SpringBoot跨域请求+Vue项目没有config目录怎么办
Vue入门2+与SpringBoot跨域请求+Vue项目没有config目录怎么办:1、引入axios请参考我的另一篇博客传送门2、新建我们自己的测试页面在views下新建目录test目录,test目录下新建Test.vue3、然后再路由中心配置router\index.js1、在单页面应用中,网页具体路径显示是由vue-router配置中 path决定的,path设置的是什么就显示什么,和name无关。2、不同路由路径下页面渲染的内容,是根据component所对应的组件来进行渲染的,和原创 2021-08-11 16:02:02 · 1263 阅读 · 2 评论 -
Vue export default {} 函数基本结构
Vue export default {} 函数基本结构传送门<script>import Confirm from '../sub/Confirm';export default { name : "First", // components 组件注册 components: { Confirm }, // 注册属性 props: { nam转载 2021-08-03 18:39:37 · 1591 阅读 · 0 评论 -
Vue入门一:自动生成的Vue项目展示逻辑分析
Vue入门一:自动生成的Vue项目展示逻辑分析我们首先来看一下自动生成的Vue项目1、main.jsnew Vue({ router, store, render: h => h(App)}).$mount('#app')指明了根试图是App2、App.vue <router-link to="/">Home</router-link> | <router-link to="/about">About</rou原创 2021-08-03 17:34:03 · 429 阅读 · 0 评论 -
elementUI和axios的安装和引入
elementUI和axios的安装和引入elementUI的安装如果你没有在创建项目的时候安装elementUI。也可以通过命令行的方式安装项目目录下执行cnpm install element-ui --saveZHR:learn zc$ cnpm install element-ui --save✔ Installed 1 packages✔ Linked 10 latest versions[1/1] scripts.postinstall element-ui@2.15.3 › a原创 2021-07-30 21:16:09 · 610 阅读 · 0 评论 -
Vue项目目录
Vue项目目录我的项目目录结构教程上的目录结构├── README.md 项目介绍├── index.html 入口页面├── build 构建脚本目录│ ├── build-server.js 运行本地构建服务器,可以访问构建后的页面│ ├── build.js 生产环境构建脚本│ ├── dev-client.js 开发服务器热重载脚本,主要用来实现开发阶段原创 2021-07-30 18:41:12 · 112 阅读 · 0 评论 -
Vue漫谈:为什么使用Vue和Vue版本选择
Vue漫谈:为什么使用Vue和Vue版本选择为什么使用Vue郑重声明:下面的内容全是抄的什么是 Vue?考虑这个需求: 我们要把一个 json对象的数据,显示到一个元素上去。如果不使用 Vue, 那么就会用到 JS 或者 JQuery,通过操作 HTML DOM 的方式,把数据显示上去。如果使用Vue, 那么仅仅需要提供数据,以及数据要绑定到的元素的id,就行了,不需要显式地操作HTML DOM。以下就用代码来表示这两种方式,通过比较,就知道Vue 是做什么的了。JS的方式首先准备一个d原创 2021-07-30 18:24:17 · 210 阅读 · 0 评论 -
Vue新建项目GUI方式
Vue3新建项目启动UI街面创建项目vue3.0以上才会有vue ui功能vue ui执行完成后会自动在浏览器打开一个界面vue3启动npm run serve千万注意是serve不是server原创 2021-07-30 14:41:05 · 652 阅读 · 2 评论 -
Vue2项目命令行方式的创建和启动
Vue2项目的创建和启动创建项目这个方式安装的是vue2的cd 项目所在文件夹ZHR:VueProjects zc$ vue init webpack learn? Project name learn? Project description 学习? Author zhangyin? Vue build standalone? Install vue-router? Yes? Use ESLint to lint your code? Yes? Pick an ESLint pre原创 2021-07-30 14:24:59 · 3413 阅读 · 0 评论