第一阶段项目技术点总结(ES6技术,vue技术)

多思多想,勤劳!

1. 扩展运算符‘...‘,主要操作用于数组的展开运算,一般简单的用于数组的合并,数组每个元素的拆分

2.const  routers = require.context ( ‘ 要操作的目标文件夹 ‘ ,布尔值(是否要检索其子文件夹),正则(以什么结尾的文件) )

  router.key().map( key => router (key). default )获取每个

3.Promise关键字,当两个同步请求的ajax的时候需要用Promise.all进行同步请求贴上代码

//此函数为不断随着时间请求ajax获取返回值

_timer() {
const getDataNow = Api.dateNow.get() // 第一个请求
const getDataAlarm = Api.dataAlarm.get() // 第二个ajax请求
Promise.all([getDataNow, getDataAlarm]).then(([res1, res2]) => {
this.digitCapture = parseInt(res1.data.result) || 0
this.digitAlarm = parseInt(res2.data.result) || 0
this._timerHandle = setTimeout(() => {
this._timer()
}, 1500)
})

4.图片上传并压缩成任意大小

// 压缩图片并转为jpeg
export function convert2JPEG(img) {
// 图片质量 待确认? 120x120
const canvas = document.createElement(‘canvas‘)
canvas.width = 200
canvas.height = 200 * (img.height / img.width)
const ctx = canvas.getContext(‘2d‘)
ctx.drawImage(img, 0, 0, canvas.width, canvas.height)
return canvas.toDataURL(‘image/jpeg‘, 0.9)
}

// 获取图片base64
export function getBase64(fileBlob) {
return new Promise((resolve, reject) => {
const fr = new FileReader()
fr.addEventListener(‘load‘, () => {
resolve(fr.result)
})

fr.addEventListener(‘error‘, () => {
reject(fr.error)
})

fr.readAsDataURL(fileBlob)
})
}

//图片上传所触发的change事件

handleUpload(e) {
const files = e.target.files
this.getBase64(files[0]).then(res => {
this.model.imageBase64 = res
})

//保证每次点击上传都会触发点击事件(清空当前value数据)
e.srcElement.value = ‘‘
}

5.上传文件处理

// 显示文件的名称和大小

chooseFile(event) {//为input的change事件
// 获取文件名:
// console.log($(‘#importFileName‘).val())
$(‘#importFileName‘).val(event.currentTarget.files[0].name + ‘_‘ + (event.currentTarget.files[0].size / 1024).toFixed(2) + ‘kb‘)
// console.log(event.currentTarget.files[0])
},
// 点击开始导入
submit() {
var fd = new FormData()
var file = $(‘#input‘)[0].files[0]
// uploadFile为约定的文件流参数名
fd.append(‘uploadFile‘, file) //添加文件数据
Api.putFile.post(fd).then((res) => {
this.this.dialogVisible = false
})
}

原文地址:https://www.cnblogs.com/zhoudayao/p/vue.html

时间: 2024-10-10 06:11:47

第一阶段项目技术点总结(ES6技术,vue技术)的相关文章

自我总结(六)---(学习j2ee+j2ee第一阶段项目)

自我完善的过程就是在不断的自我总结不断的改进. 学习了Struts2 Spring Hibernate. 十天前结束了这个课程.也考试了.这次考试老师说机试考的还不错.其实就是一个简单的用户登录,进行一个增删改的功能.因为实在元旦过后来就考试嘛!我是在元旦期间的时候也做了增删改的一个作业.所以在考试的时候也就快一些.但是在考试的时候也遇到一个问题,由于少导入了一个包,我的验证就不行了.我把这样写的运用到我后面的项目区就完全不行了.这是我最搞不明白的事.笔试题刚刚及格.课程结束了. 但是对于ssh

第一阶段项目冲刺报告会

5月12号我们进行了第一阶段项目冲刺报告会,事实证明,仅仅第一个十天冲刺阶段,不同的项目组就拉开了很大的差距.以下是我们致一团队在听报告会中作出的总结: 1.移山小分队 二手书交易平台 这是一个网上卖二手书的平台,第一阶段冲刺结束后,该团队的进度很快,实现了图书的搜索.查看评论的功能,并且建立的六个数据库也连上了.实现了各参数的传递.美中不足的是,该小组的界面是套用的模板,虽然模板简洁大方,但如果是自己亲自做出来的会更好.当然,他们的界面还是很值得我们学习的. 2.BBW 快递来了 该组之前定的

20180808 第一阶段项目展示

今天是个激动人心的日子 php第一阶段项目展示的日子 每个人都上台演讲自己制作的ppt 看一下我制作的网页部分截图 通过第一阶段项目实践的练习  知道了自己在项目中的不足之处    以后会着重的勤加练习不足之处   早日披上战袍上战场 原文地址:https://www.cnblogs.com/sp1234/p/9445337.html

第一阶段项目总结

第一次冲刺阶段我们顺利结束了,我们辛苦冲刺了10天,感受到软件工程设计冲刺阶段的紧迫感与责任感, 这段时间我们总是想能否顺利完成第一阶段冲刺的目标,很幸运经过我们不懈的努力基本完成第一阶段目标,即 主要是设计好服务器端与客户端.在那次演示我们也像大家顺利展示了我们的服务器端与客户端.大家也对我们 的第一次项目冲刺做了评价而且提了意见,我们决定根据实际情况进行改进.第一次项目冲刺之中我为了能做好 我们的项目,花了大量时间学习安卓客户端开发过程,特别是读代码并理解它,还有服务器端设计过程及代码理 解

JAVA EE 第一阶段项目问题

一: 乱码 原因: 由于同组的其他同学的myeclipse默认的编码方式是GBK,而我的默认的是UTF-8.所以当我使用svn把其他同学提交到组长那里去的代码下载下来的时候,就全乱码了! 解决问题: 我直接在Window--->Preferences-->General-->Workspace-->这里改 我上课不怎么喜欢带手机的.所以我的同学就帮我查了! 结果是在这里改的Window--->Preferences-->General-->Content Type

第一阶段项目(2 body)

body属性 <div class="H1"> <div class="top-nav"> <div class="tn1"> <img src="img/羁旅logo.png" style="width: 97.5px; height: 65px;" /> </div> <div class="tn2"> <

第一阶段项目(3body)

<div class="H1">            <div class="top-nav">                <div class="tn1">                    <img src="img/羁旅logo.png" style="width: 97.5px; height: 65px;" />              

第一阶段项目(3)

<style>属性 *{ margin: 0px; padding: 0px; } .H1{ width: 100%; } .top-nav{ width: 1200px; height: 65px; /*background-color: #87CEFA;*/ margin: 0px auto; } .tn1{ width: 100px; height: 62px; /*background-color: black;*/ margin-left: 100px; float: left; }

团队项目第一阶段冲刺站立会议10

补昨天: 今天是第一阶段冲刺的最后一天,也是项目初次成果展示的一天,忙碌的一周终于要结束了,今天的站立会议并主要讲的是晚上去哪吃饭的问题,庆祝第一阶段的结束. 五一放假好好放松一下,等待第二个冲刺阶段的到来吧.最后附团队合照一张: