
海创软件组
chainnnn
这个作者很懒,什么都没留下…
展开
-
vue使用echarts绘制柱状图与扇形图
界面效果下载以及引入npm install echarts -S在main.js中引入echartsimport echarts from ‘echarts’Vue.prototype.$echarts = echarts创建板块 <div class="echartsLeft1 echart"> <div class="HelloWorld echart-box" id="myChart1" ></div>原创 2020-10-20 15:46:31 · 2779 阅读 · 0 评论 -
使用webpack打包js/html/css/less,以及其他文件
确保下载了node/webpack首先需要已经安装了node可以使用npm,若还没可以前往百度搜索npm的安装方法初始化package.jsonnpm init下载并安装webpacknpm install webpack webpack-cli -g npm install webpack webpack-cli -D简单的打包方法创建一个空的build文件与src同级,之后在src里面写文件,但是这种办法只能打包js与json,其他文件无法打包这里定于index.js为入口文件,原创 2020-10-03 16:16:28 · 640 阅读 · 0 评论 -
vue导出excel表格
导出excel表格只需要更改document.querySelector(".table")中选择的table,看你想到导出哪一个表格<template> <div> <!-- 导出按钮 --> <div class="toexcel"> <el-button @click="exportExcel" type="primary" class="button" style="width原创 2020-10-02 19:17:15 · 234 阅读 · 1 评论 -
使用vue引入pdf文件
vue使用iframe引入pdf文件在网上找的很多文章都显示需要添加pdf.js来引入vue文件,但是还有一个很简单的办法就是使用iframe框架引入pdf效果使用iframe框架引入的话代码会变得非常简洁<template><div class="app"> <div class="agreement_picture"> <div class="pdf"> <ifram原创 2020-10-02 17:04:11 · 5616 阅读 · 3 评论 -
海创软件组-2020920-vue书写官网(element-ui+富文本编辑器)
使用element-ui组件首页引入了element-ui的表格,主要运用了 <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="姓名" prop="name"> <el-input v-model="ruleForm.name"><原创 2020-09-19 16:26:35 · 1066 阅读 · 0 评论 -
海创软件组-2020913-vue的注意小知识点
怎么让底部组件有时候显示有时候隐藏例如这个界面的底部,在外卖、搜索、订单、我的这四个路由的时候是显示的,但是当跳转到登录/注册页面的时候就隐藏起来此时可以应用注册路由的一个属性meta...原创 2020-09-13 18:48:22 · 150 阅读 · 0 评论 -
海创软件组--20200823--Vue基本知识点总结
计算属性和监视computed里可有两个方法,get与set,一般我们在实现单向数据绑定的时候只使用get,例如<div id="demo"> 姓: <input type="text" placeholder="First Name" v-model="firstName"><br> 名: <input type="text" placeholder="Last Name" v-model="lastName"><br> 姓名 1(单向):原创 2020-08-23 11:21:12 · 166 阅读 · 0 评论 -
海创软件组--20200816--layui组件使用数据表格table实现分页
效果图对表格里渲染的文件进行分页,并且实现两种下载,以及删除功能如何渲染数据在layui官网可以看到详细的代码,layui数据表格这里有个问题就是官网渲染数据的时候是使用了默认的json样式的,所以我们应该的数据应该跟它的json模板是一致的,以下是标准模板,让后台帮忙调一下数据格式会很方便如何添加右侧工具栏上图中文件与右图的工具的实现也很简单,将你调试好的数据直接应用上,注意更改url成自己请求数据的接口<!-- 这整个就是demo,表头 --><table clas原创 2020-08-16 00:03:50 · 210 阅读 · 0 评论 -
js拖拽
拖拽模板只需要引入,调用即可,无需更改代码 function drag(obj){ //当鼠标在被拖拽元素上按下时,开始拖拽 onmousedown obj.onmousedown = function(event){ //设置box1捕获所有鼠标按下的事件 /* * setCapture() * - 只有IE支持,但是在火狐中调用时不会报错, * 而如果使用chrome调用,会报错 */原创 2020-08-09 10:59:55 · 120 阅读 · 0 评论 -
海创软件组--20200809--模拟form表单使用post发送请求+form表单提交取消页面跳转+jQuery轮播图
模拟form表单使用post发送请求本网盘上传文件给后台,后台把上传的文件再传给你,当你点击下载的时候,需要传fileId给后台,后端自己模拟的form表单是这样的因为发送请求下载的post不再是简单的axios,java等,需要模拟form表单发送数据,一般的请求一直无法成功,下面代码你在应用的时候只需要更改两个地方,一个input.name你传过去参数的名字(要求与后台的一致),input.value(你要传的数据) //请求下载 //发送请求原创 2020-08-09 10:56:22 · 451 阅读 · 0 评论 -
海创软件组--20200802--网盘界面
界面显示引入组件库这个界面的展示是引入了layui组件库,然后自己修改一些样式就可以使用了如何引入内联框架在引入内联框架的时候,开始一直有问题,后来仔细的判断了一下这个问题到底出现在哪里,解决了一般img等标签可以直接通过img.src=“xxx”来更改路劲,我也用了这个方法,但是发现iframe框架无法使用这个,我是通过使用控制台发现了在iframe里路径根本不是在src里面而是在iframe.attributes.src.nodeValue里面,所以需要使用这个来更改路径点击每个板块原创 2020-08-01 16:36:32 · 448 阅读 · 0 评论 -
海创软件组--20200726--css3动画案例(使用自媒体查询)
界面这里只演示了一个板块的界面,小白点与下面的小橙点会不停的左右晃动布局首先考虑布局,在这里我分了几个板块。第一部分是底面container,淡黄部分是浏览器的整个界面。第二部分是四个粉色的div,这里使用了流体布局,四个均匀分布(container-fluid、row)。第三部分是单独的每个粉色div,在里面分块。流体布局首先引入bootstrap,之后的div的class必须写规定的,不了解的话可以看看官网添加链接描述具体分布上面圈出来的黑色部分是一个整体,就是一个简单的d原创 2020-07-25 23:26:26 · 176 阅读 · 0 评论 -
海创软件组--20200726-刮刮卡练习使用debugger调试
debugger是页面测试的一个断点,很多东西可以使用 它进行调试,下面来讲一个例子:刮刮卡练习使用debugger进行调试在上面刮了之后会显示后面一层,就相当于将外层的鼠标滑过的地方透明化,显示下面一层;为什么要使用debugger?因为这里刮刮卡想要显示一个效果:当刮到一半的时候,它可以自动显示出后面完整的图片,不需要真的全部将外面一层刮完,这样可以提高用户体验效果。那么什么时候知道刮了一半呢?首先:你需要拿到所以这个画布的所有像素点,借助flag判断它为透明的像素点有多少个,当flag&原创 2020-07-22 11:05:23 · 171 阅读 · 0 评论 -
海创软件组--20200712-HTML+CSS3雪碧图
界面效果一些框的属性文本框的type=text,密码框的type=password,提交框的type=submit,单选按钮type=radio,多选框type=checkbox单选按钮和多选框默认选中加一个checked=“checked”下拉表格的不同处但是下拉表格就不一样了name给后台使用name是为了给后台使用的多选框多选框也类似使用label点击文字选中使用label之后点击文字之后可以选中,并且要设置id对原创 2020-07-10 23:30:56 · 360 阅读 · 0 评论 -
海创软件组--20200628-班级信息列表界面
首先先创建布局,这种页面使用element-ui来做会很方便,然后你构思一下,之后拿数据,拿到数据之后考虑功能的,当你选择班级之类的进行查询后,此时是后台给你返回匹配到的数据,这个功能是前后台交互的,一个动态的过程可以自己根据需求,找到对应的板块,修改一下便可这是我的一个整体的布局接着选择的那个地方<el-header style="font-size: 12px"> <span style="text-align:left;">学生列表<spa原创 2020-06-21 13:13:02 · 550 阅读 · 0 评论 -
海创软件组--20200614-ajax发送跨域请求以及vuex的状态管理和发送给后端数据
@TO使用vuexC在这里插入代码片首先下载vuexnpm i --save vuex然后在src下面创建一个store文件夹,里面有6个js文件然后首先在index.js中引入注册接着去写state.js看一下你有什么数据需要管理,此时就要打开你的api里面的index.js看一下你取的名字叫做reqInfos,那么在state.js里面,最好就是定义一个空数组或者对象,看你需要接受的是一个什么属性然后再到mutation-types带尺寸的图片: 居中的图片: 居中并原创 2020-06-11 23:38:16 · 313 阅读 · 0 评论