大鼻子的四色鸳鸯-CSDN博客

原创 uniapp小程序步骤条封装和调用

说明：这里我还使用了uni-icon，这个同样需要插件市场下载然后引入。到现在就已经完成了，如果有报错信息注意是否安装好了icon插件。

2023-10-26 16:51:31 1194 1

步骤：1.拿实例来说，我是用ol>li做的表格。所以在做文本溢出隐藏时方式非常多。先看html部分。下面展示一些内联代码片。// A code blockvar foo = 'bar';// An highlighted block<ol class="ecologyListHeader ecologyListCenterSize" v-for="(item, index) in annualList"

2021-05-26 15:05:50 856 1

原创 vue调取数据接口后渲指定的数据

vue调取数据接口后渲指定的数据当我们拿到后台的数据时，可能想要渲染到页面指定的数据。什么意思呢？举个例子，就是我们拿到后台的数据可能有几十条甚至好几百条，但是我们前端需要展示的只是前十条。那么这个怎么用vue的方式来实现呢？首先我想到的是用slice（）方法来进行截取。他是js的一种数组方式，不太清楚的可以自行百度。那我们先用axios拿到数据。// An highlighted blockthis.$axios.get('http://xx/List').then((response) =&g

2020-08-20 14:21:09 592 1

原创微信小程序收藏功能

首先在wxml页面布局：（我这里简单的步了个局）这里我们用的技术栈就是wx：if，用它来判断收藏状态。catchtap是点击事件，点击切换收藏的状态。下面上js代码。这样一个收藏功能加提示就做好了。...

2020-06-24 22:22:16 1502

原创微信小程序购物车实现

我们要实现购物车，首先要明白的是他的需求以及实现的思路。那么它的需求是什么呢？1.判断购物车是否为空，空的话展示一个页面，否则展示购物车页。2.他要有加减，用来判断用户是否在购物车原有的基础上增加或减少。3.计算他的总价，这是必不可少的4.判断是否显示底部结算条5.一进页面就结算总价那么有这几个功能，首先我们就来排版。 //用wx:if判断购物车页是否有商品 <view class="cart" wx:if="{{!no

2020-06-23 10:51:39 1014

原创微信小程序登录

1.在.wxml页面写登录代码复制代码<view class='login'> <form> <view bindsubmit="login"> <button type='primary' form-type='submit'>登录</button> </view> </form></view>2.在.js里面写登录页面的逻辑//登录login: functio

2020-06-22 20:07:13 137

转载 Promise

一、Promise入门1.1 创建通常在创建Promise的时候，在外层进行一层封装，如下所示。function runAsync(){let p = new Promise((resolve,reject)=>{if(/异步操作成功/){resolve(value);}else{reject(error);}})return p;}Promise的构造函数接收一个参数，是函数，并且传入两个参数：resolve，reject，分别表示异步操作执行成功后的回调函数和异步操作执行

2020-06-22 07:47:04 223

转载 vue生命周期

我们接下来详细讲解下这张vue生命周期图vue生命周期可以分为八个阶段，分别是：beforeCreate(创建前),created(创建后)，beforeMount(载入前),mounted(载入后)，beforeUpdate(更新前),updated（更新后）,beforeDestroy(销毁前)，destroyed（销毁后）下面我们就来分别看看vue生命周期的这八个阶段:1,创建前(beforeCreate)对应的钩子函数为beforeCreate。此阶段为实例初始化之后，此时的数据观察和事件

2020-06-22 07:39:48 89

原创 vue登录思路

在前后端完全分离的情况下，Vue项目中实现token验证大致思路如下：1、第一次登录的时候，前端调后端的登陆接口，发送用户名和密码2、后端收到请求，验证用户名和密码，验证成功，就给前端返回一个token3、前端拿到token，将token存储到localStorage和vuex中，并跳转路由页面4、前端每次跳转路由，就判断 localStroage 中有无 token ，没有就跳转到登录页面，有则跳转到对应路由页面5、每次调后端接口，都要在请求头中加token6、后端判断请求头中有无token，

2020-06-19 23:54:43 601

原创 echarts使用

ECharts的使用通过标签方式直接引入构建好的 echarts 文件绘制一个简单的图表在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器。然后就可以通过 echarts.init 方法初始化一个 echarts 实例并通过 setOption 方法生成一个简单的柱状图，下面是完整代码。 ECharts 常用配置项的修改toolbox：工具箱的显示和隐藏show :true/false 显示和隐藏left:“ri

2020-06-18 22:10:11 127

原创后台管理系统富文本解析

1：安装富文本编辑器例如：vue-quill-editornpm install vue-quill-editor --save2：引入quillEditor样式和quillEditor包并注册import ‘quill/dist/quill.core.css’import ‘quill/dist/quill.snow.css’import ‘quill/dist/quill.bubble.css’import { quillEditor } from ‘vue-quill-editor’e

2020-06-17 22:05:46 493

原创树形结构数据渲染

我们有时候在项目开发中可能会遇到说给了你一个接口，让你渲染出一个树形结构。那么这样的该怎么做呢？首先我们既然要渲染树形，他给你的接口肯定是多维的。何为多维呢？就是一层一层嵌套的。那么既然有了接口，我们写代码的思路多元化一点的话，就可以想到可以用递归，也可以用数组方法把它转化成一维数组进行渲染。（简单思路）1，结合element渲染的话，我们可以直接使用el-tree来写树形图，在标签里lable绑定数值。2，然后设置一个空数组3，在方法里调这个接口，接到传过来对应的ID，然后赋给空数组。4，把空数

2020-06-16 23:25:27 1159

原创后台登陆系统权限列表思路

我们做这个功能还是跟以前一样，先把权限列表的接口封装到文件中。代码：export function getRuleList(userid) {return request({//这是接口后面跟的参数，就是封装好的url: rights/list,method: ‘get’})}先在页面调用封装好的方法，具体的思路拿代码来解释：1，//在文件里引入封装接口的文件import {getRuletList} from ‘@/http/api’2，getRuleList() { //这

2020-06-15 23:27:10 203

原创后台登陆系统搜索思路

1，获取输入框的值（也称关键字）模糊搜索，精确搜索2，通过事件触发将获取的值通过ajax请求搜索接口传递给后台3，后台服务器通过服务端语言（node,PHP,Java）实现接收浏览器请求4，后端语言查询数据库（Mysql,mongodb）5，将查询的结果根据搜索接口约定好的json格式返回给浏览器6，通过前端JS将返回的结果渲染展现到页面上...

2020-06-15 20:52:54 236

原创后台管理系统登录思路

一般来说我们不管是做后台管理，还是做普通项目，必不可少的其实就是登录。那么登录又是怎么实现的呢？废话不多说，上代码。首先我们把登录接口封装在一个文件里，如果这个接口有必备的参数，我们就得传参，然后在登录页引入调用。其次就是我们在登录页写登录框信息，这时候就需要接收接口必备的参数，那具体怎么接呢？先在data里设置两个放置参数的空数组。然后在登录信息框中外围prop接收，然后在信息框上v-model获取用户信息。在一个就是当我们填完用户信息的时候做什么逻辑：首先就是调用封装好的登录接口，其次在登录成功

2020-06-13 22:57:16 1608

原创 vue路由以及递归

方法不算多，但都比较实用，那下面就简单说一下。首先来说一下vue递归方法，对于这个方法的一个简单的理解就是他可以让复杂的方法简单化。举个简单的运用场景的例子，就是说假如我们做一个树形文件夹，简单点说就是层层嵌套的。那如果我们用for循环来做的话，要写很多个循环，是很不方便的。那既然多层循环基本都是一个套子，那何不用一个大框架套呢？这个时候我们就可以用递归实现。实现思路就是，我们可以先新建两个文件，然后写你的name名作为你的方法，然后再两个页面都可以调用这个方法名来实现递归数据。具体的实现方式可以参考

2020-06-11 23:26:15 1503

原创闭包，闭包作用域以及this指向

1⃣，闭包。说到闭包呢，我们想到的肯定是函数嵌套函数，函数内部可以访问外部函数的变量。但其实这只是我们平时一个普通的理解，那么比较官方的说法就是，它本质上是一个函数，与作用域环境形成的一个闭包。那么这句话该怎么理解呢？就是说它必须得是函数，那环境作用域就是我们闭包函数的一个作用域链的规则。那关于作用域我一会儿会细说。现在我们先来看一下闭包的运用场景以及实例，以便于我们了解更深刻。那么它的运用场景其实很广泛，比如说我们写一个数组，但是要取到数组的指定的值，这个时候我们就可以（假如取2到7的值）var

2020-06-11 23:24:30 186

原创 call，apply以及bind是什么及具体用法，防抖节流简单理解

今天的话主要说了改变this指向的方法和页面触发的优化功能。那先来说一下改变this指向的方法吧。那么改变this指向的方法有好好多种，比如说call：它是改变this指向的一个方法，具体语法就是把我们想要改变改变指向的函数调用. call（），在（）里写要指向的那个函数，并且还可以在指向函数后面逗号，修改指向函数里的值。其次就是apply：他们两的功能是一样的，基本的语法也差不多。那还有一个就是bind：他也是改变this指向的，与前两者不同的是他返回的并不是改变指向后的函数名，而是改变后的一.

2020-06-11 23:22:42 314

原创 DOM事件汇总

今天的话主要是说了dom的事件流，事件代理和dom事件操作方法。那下面简单的捋一下思路1⃣，首先说下dom事件流，那么何为事件流？就是一个事件它触发的过程。那dom的事件流就是当我们触发一个事件，它会先进行事件捕获，然后处于目标阶段，事件冒泡。那你又会问了，什么是事件捕获，事件冒泡？事件捕获：就是当我们触发一个事件，他不会立即执行，而是从上到下，从document一直向下捕获直到捕获到目标阶段。那我们怎么阻止默认行为呢？js写法：. preventDefaultvue写法：. captrue

2020-06-11 23:20:38 281

原创 echarts入门级使用方法

今天来说一下后台管理系统中的echarts，下面简单来捋一下。首先它是图表格式的表现形式，我们经常运用在制作统计表上，它支持很多种格式，柱形，扇形，折线形等等。用法：1⃣，通过 npm 获取 echarts，npm install echarts --save继续填写2⃣，通过标签方式直接引入构建好的 echarts 文件，3⃣，绘制一个简单的图表绘制图表第一步就是先给他一个盒子来做他的容器，然后设置id名或类名。再script里通过类名或id名获取盒子，然后eacherts. init注入，

2020-06-11 23:18:54 300

原创 vue后台管理系统搭建与登录

说一下后台管理系统的登录功能，这里需要用的辅助工具有vue架手架和elelment-ui。那下面简单的捋一下。1⃣，首先，我们先安装好vue最新的架手架2⃣，然后安装element-ui，在项目里进行配置。3⃣，使用element框架写登录的样式代码，这里需要注意的是，如果我们的输入框需要按逻辑操作，就要现在data里写一个空的表单规则，ruleForm: {username: “”,password: “”},然后新设置一个规则，在规则里写你表单规则的逻辑，rules: {usern

2020-06-11 23:15:59 512

原创 axios封装接口步骤详解

这里写自定义目录标题axiso封装接口步骤axiso封装接口步骤说一下关于axiao封装：我们一般都是在做一个大型项目的时候，需要用到很多接口时，我们为了方便使用，就把接口封装起来。那么思路是什么呢？首先我们先在src下创建一个文件夹，可以叫你自己的名字，但是为了代码规范，还是建议起接口相关名称，我这边就叫http了。1⃣，然后在http才新建两个文件，2⃣，一个用来放你的接口设置，比如说总接口呀，环境呀，超时时间呀，拦截器呀等等。3⃣，那么另一个文件就放我们要封装的接口，4⃣，最终在

2020-06-11 23:12:06 1861

原创 vue3.0架手架搭建以及注意事项

安装vue3.0的脚手架，主要步骤分为以为几布：1⃣，npm install -g @vue/cli，(安装)2⃣，vue create 你的文件名， //或者vue ui (这两个方式都是用来创建文件的但是后者是页面化的，需要自己手动配置需要的技术栈)3⃣，cd 你的文件夹（进去文件夹）4⃣，npm run serve （运行）以上就是搭建一个vue3.0脚手架的一个过程。那么架子搭好了，我们就需要去使用，使用的过程中我们肯定需要一些技术栈呀，样式呀这些的配置，那接下来就

2020-05-18 21:23:20 247

原创数组常用方法（es6）

16.June workTwelve 记录 | 郭晴今日工作内容 1. 今天郝老师主要接着昨天讲了es2015新增的数据类型symbol以及拓展出来的别的问题，还有es2015默认参数，gennerater迭代器，peomise封装以及async，await。那具体来说一下吧，首先symbol它是es2015新增的数据类型，也是新增的基本数据类型，那么在此之前基本数据类型是五种。随着这个问题拓展的问题呢，可能是怎么去识别数据类型，那么分别为typeof，insdanceof，和object. prot

2020-05-16 20:03:50 155

weixin_47038177的博客