- 博客(27)
- 收藏
- 关注
RSS订阅
原创 vue完整版的移动端和vuex的购物车和登录
项目效果提示：可以点击下面的【文章目录】可以跳转到想去的一项例如购物车代码，分类渲染代码文章目录项目效果前言二、使用步骤1.main.js引入库2.分类数据接口请求及数据渲染点击切换布局3.商品列表数据的渲染及结构布局4.首页点击图片进入详情页5.点击商品加入购物车，存储到vuex中6.购物车数据渲染，计算购物车商品总价格.全选.反选.删除7.首页模糊搜索【单独配置一个路由】8.首页点击返回顶部9.显示购物车标签已加入的数量总结前言1.首页基本布局 【轮播图+搜索框+菜单栏+商品列表】2.
2021-04-17 16:44:21
836
原创 tab切换适用于H5和PC不借助组件
tab切换适用于H5和PC不借助任何组件文章目录tab切换适用于H5和PC不借助任何组件前言一、代码步骤总结前言以下就是今天要讲的内容，本文仅仅简单介绍了自己经常在项目会用到tab切换，但是又不想组件，所以就自己做了一个，希望对看到的同行有帮助。提示：以下是本篇文章正文内容，下面案例可供参考使用一、代码步骤代码如下（示例）： <!--tab--> <div> <ul class="tabsbox"> <li
2021-10-26 19:55:26
318
原创 使用uni-app设置全局页面适用于模态框
使用uni-app设置全局页面适用于模态框，只要调用就可以实现文章目录使用uni-app设置全局页面适用于模态框，只要调用就可以实现前言一、首先我们要先创建一个弹框的页面二、然后在main.js里面调用（设置全局）2.进入弹框详情页3.在页面调用总结前言弹框完整代码链接在做uni-app移动端H5要实现一个弹框，效果需要在不管用户单击那个页面都会出现弹框，除非用户点击弹框进入详情查看点击确定后，就不会出现弹框了效果图:一、首先我们要先创建一个弹框的页面我是在项目里的common下面的D
2021-10-09 11:21:32
2564
原创 如何使用swagger的API接口获取数据并且封装
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、第一个页面http接口路径二、第二个页面三、第三个页面代码封装二、第二个页面数据渲染总结前言提示：一共分为3个页面来进行跨域操作和接口封装一、第一个页面http接口路径示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。module.exports = { devServer: { host: 'localhost', port: 8080, pr
2021-06-21 21:03:42
2190
1
原创 Vue如何配置基准地址？
前言这是一个比较简单的一个基础配置，当然也可以实现请求数据的功能1.写入配置：直接在src下面创建一个文件夹，效果如下：//引入axiosimport axios from 'axios';//vuex// import store from '../store/index';//配置基准地址const Serve = axios.create({ baseURL: 'http://47.99.166.157:3000', // transformRequest: [f
2021-05-18 16:21:16
1092
原创 Gitee创建分支合并操作
文章目录一、如何创建一个分支？1.合并分支总结一、如何创建一个分支？1.首先git init初始化，如果项目里有.git就不用初始化了1.初始化仓库：git init2.创建分支：git branch Alisa3.可以查看分支：git branch4.点击可以切换分支：git checkout Alisa5.把本地分支推到线上：git push origin Alisa6.删除本地分支：git branch -D Alisa如果想要查看是否在Git已经创建成功分支可以查看下面效果：
2021-04-29 17:10:38
7681
6
转载 Vue安装支持SCSS插件
Vue安装支持SCSS插件cnpm install node-sass --save-dev //安装node-sass cnpm install sass-loader --save-dev //安装sass-loader cnpm install style-loader --save-dev //安装style-loader安装完成后，如果运行报以下错：Module build failed: TypeError: this.getResolve is not a functi
2021-04-15 16:01:06
357
原创 nodejs npm包管理常用命令介绍
1、输入 npm config ls -l 可以查看当前的设置2、针对某一项设置，可以通过下面方式：npm config set 属性名 属性值eg：npm config set prefix “C:\123”3、读取某一项配置，可以通过下面方式：npm config get 属性名eg：npm config get prefix4、npm的常用命令：npm -v：查看npm安装的版本npm help xxx 查看帮助cnpm install 安装依赖npm run serve
2021-04-13 15:00:09
119
原创 关于Javascript正则表达式替换
正则表达式替换操作 RegExp() replace()一、正则表达式匹配 RegExpnew RegExp(pattern, attributes);/ pattern/attributes参数参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。参数 attributes 是一个可选的字符串，包含属性 “g”、“i” 和 “m”。 g --全局匹配；i–忽略大小写匹配；m–多行匹配。需要转译的字符二、replace（）stringObject.replac
2021-04-13 14:31:25
2944
原创 vue实现todoList
系列文章目录1、在输入框中输入内容后按enter键，即可把内容添加到下面的列表中（如果内容为空则不添加）2、动态计算有几个未完成的任务3、点击复选框，实现选中或不选中效果（即完成或未完成）4、鼠标移入列表，会出现一个删除按钮，点击删除按钮即可删除该列表5、双击列表中的内容，可对列表内容进行编辑编辑完成后，按enter键完成编辑，或者当输入框失去焦点的时候也是完成编辑如果想要取消修改，按esc键即可取消编辑6、单击上面的所有任务、未完成任务、已完成任务，三个按钮可以切换任务列表7、已经添加的
2021-04-10 21:01:14
415
原创 vue--选项卡效果实现
文章目录二、2种方法可以实现1.效果一2.效果二二、2种方法可以实现1.效果一代码如下（示例）：<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="
2021-04-10 20:01:24
672
原创 Vue中的v-for为什么要添加唯一的key属性，让我来解答吧
总结 ：所以一句话，key的作用主要是为了高效的更新虚拟DOM。另外vue中在使用相同标签名元素的过渡切换时，也会使用到key属性，其目的也是为了让vue可以区分它们，否则vue只会替换其内部属性而不会触发过渡效果。
2021-04-10 14:49:19
415
原创 用vue时间做实时展示组件
项目场景：代码描述：可以一些项目中添加或者参考：<template> <div class="replace"> <span class="times">{{ time }}</span> </div></template><script>export default { data() { return { time: "2020年08月31日 10:29" }
2021-04-10 00:42:09
404
原创 一个 基于 Element-ui 的简单后台模板
系列文章目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加例如：第一章 Python 机器学习入门之pandas的使用提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录系列文章目录前言一、视屏样式二、使用步骤1.router.js配置2.首页About.vue代码总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇
2021-04-09 14:27:58
1957
1
原创 vuex 数据持久化插件
下包npm install vuex-persistedstate --savestore.js 里面导入import Vue from 'vue'import Vuex from 'vuex'//引入vuex 数据持久化插件import createPer from 'vuex-persistedstate'Vue.use(Vuex)export default new Vuex.Store({ plugins: [createPer()], //持久存储数据 state:
2021-04-08 15:56:30
184
原创 JS实现购物车全选、不选、反选的功能
JS实现购物车全选、不选、反选的功能（十七） 这里没有使用购物车啦，不过原理都是一样的啦 效果： <!DOCTYPE html><html lang="en"><head> <meta charset="UTF...
2021-04-08 14:56:35
281
原创 vue基础（vue实例、渲染、样式绑定、模板语法）
一、vue是什么vue.js官网上其实介绍的很详细Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。二、vue实例看一个vue实例完整语法v-on:click=”doSomething”缩写@click=”doSom
2021-04-06 18:48:53
117
转载 前端复习总结HTML+CSS-超详细，超全面
HTML5+CSS3复习总结 一.HTML基础1.网页开发工具2.常用基本标签（1）文本标签（2）表格标签（3）列表标签（4）表单标签 3.HTML5新增(1)HTML5 新增的语义化标签(2）新增的多媒体标签(3)新增的input 类型(4)新增的表单属性 ...
2021-04-06 11:34:58
463
原创 移动端flex弹性盒子布局
今天在做项目的时候遇到一个关于flex布局的问题1.如何使用flex的各种属性 ul { width: 100%; height: 500px; background: beige; display: flex; flex-wrap: wrap; /*自动换行*/ justify-content: space-between;/*贴到两边*/
2021-04-04 19:24:45
202
原创 gitee码云第一次怎么上传项目到仓库中
1.首先注册号之后点击右面加号然后在点击新建仓库2.写仓库名称，最好是英文，写完仓库名称.路径自动会添加上不用管，【点击公开】最后点击创建打开之后选择HTTPS找到项目地址，右击选第二个git init ### 初始化git的仓库 .git文件夹git status ### 查看当前仓库的状态 红色的文件，工作区git add . ###add后面加一个点 把工作区提交到暂存区中 文件是绿色的git commit -m “第一次提交” #### 把代码有暂存区提交到版本库输
2021-03-31 18:49:25
900
原创 移动端线上接口列表页渲染进入详情页渲染
移动端线上接口列表页渲染进入详情页渲染router.js配置Sy首页列表页<template> <div id="replace"> <van-grid :column-num="2"> <van-grid-item v-for="item of arr" :key="item.id" icon="photo-o" text="文字" > <p><img :src="item.pic" @c
2021-03-20 22:56:44
248
原创 线上接口异步操作获取数据并加入购物车
1.先使用线上接口获取数据 async created() { // 轮播 var lunbo = await this.http.get("https://locally.uieee.com/slides"); this.lunbo = lunbo.data; // 列表 var liebiao = await this.http.get("https://api.it120.cc/small4/cms/news/list"); console.lo
2021-02-24 22:29:56
270
原创 列表页进入详情页App
1.在首页写下id,当点击这个id时跳转到详情页比如说当你点击图片的时候就会跳转到详情页 methods: { goxq(id) { this.$router.push("/xq?id=" + id); }, },2.在详情页接受数据并点击返回列表页methods: { onClickLeft() { this.$router.push("/sy") },},点击返回首页 <van-nav-bar titl
2021-02-24 22:01:31
258
原创 通过json文件渲染到页面
通过json文件渲染到页面1.为了方便获取把json放到public文件夹里面2.获取数据 created() { this.$http.get("/list.json").then((res) => { console.log(res); this.arr = res.data.result; }); },3.然后开始渲染页面，这个是图片九宫格，使用了懒加载 <van-grid :column-num="2"> <
2021-02-23 21:08:10
2599
1
原创 vueApp图片懒加载使用
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式这里是引用插入链接与图片前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进
2021-02-23 15:09:49
343
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人