Vue
文章平均质量分 74
九八年的尾巴
一个愿意分享和倾听的年轻人
展开
-
Mac系统安装Node&Npm&Vue-Cli&创建项目
Vue与Node的关系概述使用vue.js一定要安装node.js么?准确的说是使用vue-cli搭建项目的时候需要node.js。也可以创建一个.html文件,然后通过如下方式引入Vue,一样可以使用Vue<!-- 开发环境版本,包含了有帮助的命令行警告 --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>但是使用node是比较方便的,打包部署,解析vue单文件组成,解原创 2021-05-11 19:43:54 · 588 阅读 · 2 评论 -
前端环境搭建:前端主流编辑器VSCode安装及常用Vue插件安装配置
前端编辑器 vscode:免费开源的现代化轻量级代码编辑器,支持大部分主流的开发语言的语法高亮、智能代码补 全、自定义热键、代码对比 Diff、GIT 等特性,支持插件扩展,软件跨平台支持 Win、Mac 以及 Linux其他编辑器:sublime、hbuilder、webstormvscode安装地址:https://code.visualstudio.com/Download直接下载安装,然后配置安装路径就OK了设置为中文语言环境,这里需要使用快捷键来实现 win:【Ctrl原创 2020-12-22 23:33:04 · 310 阅读 · 1 评论 -
前端开发环境搭建:新版Vue+脚手架Vue-Cli4.3安装讲解以及目录结构讲解
什么是Vue目前前端最主流框架,套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合文档地址: https://cn.vuejs.org/建议先安装node.js和npm修改为淘宝镜像,这样在下载vue时可以节省一些时间。没有配置过的可以看我发布的博文有教程安装新版Vue(直接使用cli)npm install vue(可以不用)什么是VUE-CLIVue提供了一个官方的CLI原创 2020-12-22 23:31:38 · 366 阅读 · 0 评论 -
前端开发环境搭建:Node环境安装和Npm介绍及修改淘宝源镜像
什么是NodeJS:Node.js 也是js就是运行在服务端的 JavaScriptNode.js能做的 java也能做 相反也一样什么是npm:nodejs的包管理工具,可以下载使用公共仓库的包,类似maven 包安装分为本地安装(local)、全局安装(global)两种npm install express # 本地安装express 也就是当前项目应用到npm install express -g # 全局安装expressnpm list -g原创 2020-12-22 23:27:57 · 309 阅读 · 0 评论 -
uni-simple-router路由页面埋点
针对每一个页面进行埋点使用路由的方式记录网页的跳转,借助uni-simple-router:http://www.hhyang.cn/1.uni-app项目打开终端安装插件:npm install uni-simple-router2.初始化操作2.1:modules:存放路由 页面跳转通过modules去处理2.2:modules下index.js文件// router/modules/index.jsconst files = require.context('.', false, /\原创 2020-06-28 23:19:13 · 1523 阅读 · 0 评论 -
日志数据收集埋点事件
大数据操作第一步,就是收集用户数据,在前端页面编写js代码用于发送日志数据这种操作称为埋点埋点分三种:代码埋点数据可视化埋点全埋点埋点主要关注两点:地点和数据埋点事件 也就是自定义指令,在需要的地方给标签属性即可。减少代码量vue main.js文件下处理//埋点处理Vue.directive('log',{ //log 标签名称 bind(el,binding){ //el.addEventListener 监听事件 只要在某一个元素使用log元素 点击就会执行这段对应的代原创 2020-06-28 23:17:42 · 1000 阅读 · 0 评论 -
layui自定义模块、日志打印使用、layui文件上传云服务器
1.layui自定义模块:方便接口调用 异步请求url地址不方便 解决:扩展模块 1):定义对应js文件 ja>lay-module创建http目录创建http.js文件 2):lay-config.js文件中引入模板 3):页面使用引入js文件不适用组件引入url方式,更简单 1).js文件下创建http.js文件const $api="http://localhost:8070/" 2).使用 引入js文件路径。url路径为 url:$api+’…’原创 2020-06-25 21:11:05 · 1750 阅读 · 0 评论 -
uni-aap-项目实战1
使用框架uni-app.开发一端,在多端运行,(微信小程序,支付宝小程序,安卓ios等都是可以处理)后端采用之前文章githubhttps://uniapp.dcloud.io/官方文档前端传数据为空,向发送方找问题 const data = {//发送数据名要和实体类名一致 username: this.account, password: this.password }; //声明变量,es6的写法存储data数据 let user = {}原创 2020-06-09 14:01:15 · 407 阅读 · 0 评论 -
vue项目实战-4.前端渲染.微信小程序
设置整个页面结构1.由于是手机端项目,所以需要加上手机端相关处理,修改index.html代码,增加meta处理<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/><meta http-equiv="Content-Type" content="text/html; charset原创 2020-06-05 17:06:09 · 814 阅读 · 0 评论 -
vue项目实战-3,页面跳转后台传值取值
page目录下创建goods目录创建goods.vue商品页面<template> <div> 这里是商品界面 </div></template><script> export default{ name:"Goods" }</script><style></style>修改router目录下index.js文件,设置路由import Vue from 'vue'impor原创 2020-06-04 12:23:43 · 1265 阅读 · 0 评论 -
vue项目实现-2。vuex本地存储token、json数据
当state的值发生更改时怎么去处理1.在store目录下创建state.js文件,用于存储state数据以及和本地存储整合//声明一个默认的tokenlet defaultToken = "null"if(localStorage.token){ // 判断localStorage是否存在该值//声明一个默认的token defaultToken = localStorage.token}export default { token:defaultToken}2.修改st原创 2020-06-03 18:12:33 · 1908 阅读 · 0 评论 -
vue技术点之vuex初步使用
接上篇技术点axios,整个vue中,发送一个请求获得了数据,获得tonken。问题:拿到tonken存储问题,而且需要在多个界面多个组件中用到这个数据vuex:状态管理VUEX,状态管理模式,核心是store(仓库),仓库中的数据是响应式的,放store状态发生改变的时候,数据也会发生更新,并且必须通过提交mutation改变状态核心概念有state:单一状态树,存储数据getter:store的计算属性,会把返回值进行缓存mutation:提交事件,用于改变store状态action:提原创 2020-06-01 17:35:55 · 151 阅读 · 0 评论 -
vue项目实战-1。vue技术点之axios,前后端分离登陆验证tonken连接redis,springcloud
后端项目在cloud分栏有git上传,需要自行下载vue 脚手架 VUE-cli和后端交互,离不开ajax下载ajax封装:npm install axios --save在父组件中访问ajax,得到数据之后返回给子组件1.终端下载npm install axios --save2.导包: import axios from ‘axios’3.为了避免跨域问题,端口号冲突问题,这时候需要创建vue.config配置文件 接口映射module.exports = { //代理,当用户发送请原创 2020-06-01 00:58:26 · 432 阅读 · 0 评论 -
vue-4项目实战
创建项目下载最新版本HBuildersrc下App.Vue文件< template>html代码 < script>js代码 < style>样式main.js文件vue 路由 项目里的url,vue有专门的组件项目结构1.创建router/index.js设置import Vue from 'vue'import Router from 'vue-router'import Index from '../page/index/index.vue'/原创 2020-05-27 17:43:25 · 180 阅读 · 0 评论 -
vue-3 监听事件
接上一篇文件< template>标签:作用类似于一个标签,当我们编译不会为html代码用于存放v语句的处理 <template v-if="isShow"> //在运行时不会成为一个真正的标签 可以理解为一个箱子 //当我们运行在页面时 只显示箱子里的内容 是否显示 </template> date:{isShow:true}//true显示 false不显示监听事件冒泡事件 <div @click="fun1">原创 2020-05-26 16:59:14 · 5381 阅读 · 0 评论 -
vue-2计算属性与侦听器
计算属性侦听器监听一个值,当我们的值发生变化时去处理 watch:{//控制台打印检测值变化 v1:function(newV,oldV){ console.log("开始变化"+newV) console.log("老的变化"+oldV) } }绑定HTML CSS<h1 :class="{c1:isC1}">绑定Class的值</h1>var app = new Vue({ data:{isc1:true原创 2020-05-25 19:38:29 · 165 阅读 · 0 评论 -
vue-1初步学习
国内前端框架特点一:可以把我们的界面划分成多个部分,把这些组件组成在一起,类似于拼图 二:支持双向绑定vue官方文档:https://cn.vuejs.org/v2/guide/引入js文件,可直接创建vue项目响应式处理调出控制台 在控制台里对象名.数据名 可直接更改值for循环函数绑定<button v-on:click="f1">点击下</button> methods:{//函数绑定 f1:function(){原创 2020-05-25 15:30:29 · 123 阅读 · 0 评论