m0_46239267的博客

界面效果 下载以及引入 npm install echarts -S 在main.js中引入echarts import echarts from ‘echarts’ Vue.prototype.$echarts = echarts 创建板块 <div class="echartsLeft1 echart"> <div class="HelloWorld echart-box" id="myChart1" ></div>

确保下载了node/webpack 首先需要已经安装了node可以使用npm，若还没可以前往百度搜索npm的安装方法 初始化package.json npm init 下载并安装webpack npm install webpack webpack-cli -g npm install webpack webpack-cli -D 简单的打包方法 创建一个空的build文件与src同级，之后在src里面写文件，但是这种办法只能打包js与json，其他文件无法打包 这里定于index.js为入口文件，

导出excel表格 只需要更改document.querySelector(".table")中选择的table，看你想到导出哪一个表格 <template> <div> <!-- 导出按钮 --> <div class="toexcel"> <el-button @click="exportExcel" type="primary" class="button" style="width

vue使用iframe引入pdf文件 在网上找的很多文章都显示需要添加pdf.js来引入vue文件，但是还有一个很简单的办法就是使用iframe框架引入pdf 效果 使用iframe框架引入的话代码会变得非常简洁 <template> <div class="app"> <div class="agreement_picture"> <div class="pdf"> <ifram

使用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"><

怎么让底部组件有时候显示有时候隐藏 例如这个界面的底部，在外卖、搜索、订单、我的这四个路由的时候是显示的，但是当跳转到登录/注册页面的时候就隐藏起来 此时可以应用注册路由的一个属性meta ...

计算属性和监视 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(单向):

效果图 对表格里渲染的文件进行分页，并且实现两种下载，以及删除功能 如何渲染数据 在layui官网可以看到详细的代码，layui数据表格 这里有个问题就是官网渲染数据的时候是使用了默认的json样式的，所以我们应该的数据应该跟它的json模板是一致的，以下是标准模板，让后台帮忙调一下数据格式会很方便 如何添加右侧工具栏 上图中文件与右图的工具的实现也很简单，将你调试好的数据直接应用上，注意更改url成自己请求数据的接口 <!-- 这整个就是demo，表头 --> <table clas

拖拽模板 只需要引入，调用即可，无需更改代码 function drag(obj){ //当鼠标在被拖拽元素上按下时，开始拖拽 onmousedown obj.onmousedown = function(event){ //设置box1捕获所有鼠标按下的事件 /* * setCapture() * - 只有IE支持，但是在火狐中调用时不会报错， * 而如果使用chrome调用，会报错 */

模拟form表单使用post发送请求 本网盘上传文件给后台，后台把上传的文件再传给你，当你点击下载的时候，需要传fileId给后台，后端自己模拟的form表单是这样的 因为发送请求下载的post不再是简单的axios，java等，需要模拟form表单发送数据，一般的请求一直无法成功，下面代码你在应用的时候只需要更改两个地方，一个input.name你传过去参数的名字（要求与后台的一致），input.value（你要传的数据） //请求下载 //发送请求

界面显示 引入组件库 这个界面的展示是引入了layui组件库，然后自己修改一些样式就可以使用了 如何引入内联框架 在引入内联框架的时候，开始一直有问题，后来仔细的判断了一下这个问题到底出现在哪里，解决了 一般img等标签可以直接通过img.src=“xxx”来更改路劲，我也用了这个方法，但是发现iframe框架无法使用这个，我是通过使用控制台发现了在iframe里路径根本不是在src里面 而是在iframe.attributes.src.nodeValue里面，所以需要使用这个来更改路径 点击每个板块

界面 这里只演示了一个板块的界面，小白点与下面的小橙点会不停的左右晃动 布局 首先考虑布局，在这里我分了几个板块。 第一部分是底面container，淡黄部分是浏览器的整个界面。 第二部分是四个粉色的div，这里使用了流体布局，四个均匀分布(container-fluid、row)。 第三部分是单独的每个粉色div，在里面分块。 流体布局 首先引入bootstrap，之后的div的class必须写规定的，不了解的话可以看看官网 添加链接描述 具体分布 上面圈出来的黑色部分是一个整体，就是一个简单的d

debugger是页面测试的一个断点，很多东西可以使用 它进行调试，下面来讲一个例子： 刮刮卡练习使用debugger进行调试 在上面刮了之后会显示后面一层，就相当于将外层的鼠标滑过的地方透明化，显示下面一层； 为什么要使用debugger？ 因为这里刮刮卡想要显示一个效果：当刮到一半的时候，它可以自动显示出后面完整的图片，不需要真的全部将外面一层刮完，这样可以提高用户体验效果。 那么什么时候知道刮了一半呢？ 首先：你需要拿到所以这个画布的所有像素点，借助flag判断它为透明的像素点有多少个，当flag&

界面效果 一些框的属性 文本框的type=text,密码框的type=password，提交框的type=submit，单选按钮type=radio，多选框type=checkbox 单选按钮和多选框默认选中加一个checked=“checked” 下拉表格的不同处 但是下拉表格就不一样了 name给后台使用 name是为了给后台使用的 多选框 多选框也类似 使用label点击文字选中 使用label之后点击文字之后可以选中，并且要设置id 对

首先先创建布局，这种页面使用element-ui来做会很方便，然后你构思一下，之后拿数据，拿到数据之后考虑功能的，当你选择班级之类的进行查询后，此时是后台给你返回匹配到的数据，这个功能是前后台交互的，一个动态的过程 可以自己根据需求，找到对应的板块，修改一下便可 这是我的一个整体的布局 接着选择的那个地方 <el-header style="font-size: 12px"> <span style="text-align:left;">学生列表<spa

@TO使用vuexC 在这里插入代码片 首先下载vuex npm i --save vuex 然后在src下面创建一个store文件夹，里面有6个js文件 然后首先在index.js中引入注册 接着去写state.js看一下你有什么数据需要管理，此时就要打开你的api里面的index.js看一下 你取的名字叫做reqInfos， 那么在state.js里面，最好就是定义一个空数组或者对象，看你需要接受的是一个什么属性 然后再到mutation-types 带尺寸的图片: 居中的图片: 居中并