vue学习
草莓冻冻
"你自人山人海中而来,原来只为了给我一场空欢喜。"
你要去做一个懂事的大人,不要回头,不要难过。
展开
-
在vue-element-admin项目中Post 请求带参数 报请求超时
Axios 如果发送Post请求,并且带上请求参数时,会一直报请求超时,如下// src/api/test.jsimport request from '@/utils/request'export default { test () { return request({ url: '/test', method: 'post', data: { "name": "张三" } }) }}这个问题是因为mo原创 2020-10-27 16:44:59 · 3778 阅读 · 9 评论 -
在vue-element-admin项目中解决跨域问题
在 vue.config.js 文件中使用 devServer.proxy 选项进行代理配置devServer: { // ... before: require('./mock/mock-server.js'), // 开发环境代理配置 解决跨域问题 proxy: { [process.env.VUE_APP_BASE_API]: { // 是.env.development 文件的 /dev-api target: ' https://w.原创 2020-10-27 16:30:30 · 3579 阅读 · 0 评论 -
vue自定义指令 —— directive的用法
Vue中内置了很多的指令,如v-model、v-show、v-html等,但是有时候这些指令并不能满足我们,或者说我们想为元素附加一些特别的功能,这时候,我们就需要用到vue中一个很强大的功能了—自定义指令。在开始之前,我们需要明确一点,自定义指令解决的问题或者说使用场景是对普通 DOM 元素进行底层操作,所以我们不能盲目的胡乱的使用自定义指令。1. 注册假设我们需要自定义一个 v-focus 指令,即在 或 标签初始化时获得焦点。注册自定义指令分为全局注册与局部注册两种:全局注册:// 注原创 2020-10-22 17:16:13 · 613 阅读 · 0 评论 -
vue中数组变动更新检测
Vue包含两种观察数组的方法分别如下:1. 变异方法变异方法会改变被这些方法调用的原始数组,它们也将会触发视图更新,这些方法如下:push()pop()shift()unshift()splice()sort()reverse()2.非变异方法非变异方法与变异方法的区别就说,非变异方法不会改变原始数组,总书返回一个新数组,当使用非变异方法时,可以用新数组替换旧数组,非变异方法大致有:filter() , concat(), slice()arr = arr.filter(item原创 2020-10-22 16:42:51 · 607 阅读 · 0 评论 -
uni-app视频播放及下载功能
视频列表页<template> <view class="video_main"> <view class="video_item" v-for="item in list" :key="item.id" @click="handleGoVideo(item)" > <image mode="widthFix" :src="item.img" .原创 2020-10-15 16:32:02 · 6979 阅读 · 0 评论 -
uni-app中定义全局数据
1. 可以将参数挂载到Vue.prototype上// main.js// Vue.prototype.baseURL = 'http://uniapp.dcloud.io' // 全局参数在 pages/index/index.vue 中调用<script> export default { onLoad(){ console.log(this.baseURL); } } </script&原创 2020-10-15 15:32:26 · 1405 阅读 · 0 评论 -
uni-app下载图片到系统相册
使用到的 API 有 :uni.downloadFileuni.saveImageToPhotosAlbum<template> <view> <view class="download"> <view class="download_btn" @click="download" >下载图片</view> </view> </view>&原创 2020-10-14 17:04:51 · 845 阅读 · 0 评论 -
uni-app项目中封装手势滑动组件
小程序原生api中没有封装手势滑动组件手势封装的思路给容器绑定两个触屏事件 touchstart 和 touchend用户按下屏幕事件按下时间: Date.now() 时间戳按下坐标: clientX 和 clientY用户离开屏幕事件离开时间: Date.now()离开坐标: clientX 和 clientY根据两个时间运算判断用户按下屏幕时长是否合法根据两对坐标判断距离是否合法 判断用户滑动方向<!-- demo.vue--><template>原创 2020-10-14 11:15:07 · 1233 阅读 · 0 评论 -
uni-app自定义组件的使用
以查看专辑详情为例:步骤在 src 根目录下新建 components目录,存放公共组件<!-- src/components/goDetail.vue --><template> <view @click="handleClick"> <slot></slot> <!-- 插槽占位 --> </view></template><script>export defau原创 2020-10-13 17:37:35 · 4195 阅读 · 0 评论 -
Vuex的基本使用总结
1.Vuex概述Vuex是实现组件全局状态(数据)管理的一种机制,可以方便的实现组件之间的数据共享。使用Vuex管理数据的好处:能够在vuex中集中管理共享的数据,便于开发和后期进行维护能够高效的实现组件之间的数据共享,提高开发效率存储在vuex中的数据是响应式的,当数据发生改变时,页面中的数据也会同步更新什么样的数据适合存储到 Vuex 中一般情况下,只有组件之间共享的数据,才有必要存储到vuex中;对于组件中的私有数据,依旧存储在组件自身的 data 中即可。2.vuex的使用安原创 2020-10-06 23:27:53 · 707 阅读 · 0 评论 -
把代码添加到码云的git操作
如果是第一次安装git 需要初始化gitgit init检查一下项目的状态:git status有一些文件需要再提交一下,先把文件提交到暂存区:git add .然后在本地做一次提交git commit -m "add files"再次检查一下状态git status此前都是在本地操作,提交到码云中git remote add origin https://gitee.com/tangchaolizi-co/vue_shop.git本地仓库跟云端仓库做一些关联gi原创 2020-09-24 20:09:55 · 113 阅读 · 0 评论 -
Vue脚手架的三种安装方式
Vue 脚手架用于快速生成 Vue 项目基础架构,其官网地址为:https://cn.vuejs.org/index.html使用步骤1.安装 3.x 版本的 Vue 脚手架npm install -g @vue/cli2.基于 3.x 版本的脚手架创建vue项目基于 交互式命令行 的方式,创建 新版 vue 项目vue create vuedemo基于 图形化界面 的方式,创建 新版 vue 项目vue ui再次打开可以输入命令行直接启动项目输原创 2020-09-24 10:36:03 · 1084 阅读 · 0 评论