vue-axios跨域使用
在config.index.js設(shè)置本地代理
proxyTable: {
'/api': {
target: 'http://192.168.5.4:8686/',
changeOrigin: true,
pathRewrite: {
'^/api': '/'
}
}
},
在config.dev.env.js設(shè)置開發(fā)接口
module.exports = merge(prodEnv, {
NODE_ENV: '"development"',
API_HOST:'/api/'
})
在config.prod.env.js設(shè)置生產(chǎn)接口
module.exports = {
NODE_ENV: '"production"',
API_HOST:'http://192.168.5.4:8686/'
vue img標簽數(shù)據(jù)定義
<img?v-bind:src="item.pic" />
單選框組件
.cbox{display:block;width:16px;height:16px;border:1px solid #ccc;background:#fff;position: relative;} .cbox.checked{background:#10adff;} .cbox.checked:after{content:"√";color: #FFFFFF;position: absolute;left: 2px;top: -3px;}
倒計時
export default {
data(){
return{
time: 5 // 倒計時
}
},
methods: {
send() {
let me = this;
let interval =setInterval(function() {
if ((me.time--) <1) {
me.time = 0;
me.$router.push({path: '/'});
clearInterval(interval);
};
}, 1000);
}
},
mounted(){
this.send();
}
}
自定義跳轉(zhuǎn)頁面跳轉(zhuǎn)頁面
this.$router.push({path: '/'});
vuecli Axios Post請求后端無法接受參數(shù)正確寫法
data (){
return{
data:{}
}
}
this.data={
"dataType":"day"
}
this.$ajax({
method:'post',
url:user,
params:{
"requestStr":this.data
}
})
.then(function(res){
console.log(res.data);
console.log(res.data.apiFlag);
console.log("成功");
})
.catch(function(err){
console.log(err);
console.log("失敗");
})
}
vue生命周期
vue-cli Java類加密key iv
vuex使用
下載vuex：cnpm install vuex --save
目錄結(jié)構(gòu)
vuex的getters帶有緩存慎用！?。?/p>
cookie操作
獲取機器碼
// 獲取機器碼
? generateUUID() {
var d = new Date().getTime();
var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g,function(c) {
var r = (d + Math.random()*16)%16 | 0;
d = Math.floor(d/16);
return (c=='x' ? r : (r&0x3|0x8)).toString(16);
});
return uuid;
}
后端返回的驗證碼圖片可能是個圖片流
后端返回的驗證碼圖片可能是個圖片流也可以用vue賦值形式
vuecli的網(wǎng)站favicon圖標設(shè)置
index.html設(shè)置
cookies的設(shè)置獲取和刪除
文本超出隱藏顯示....
.textt{
display:block;
padding-right:14px;
width:100px;/*字符的寬度是50*/
? white-space:nowrap;/*禁止換行*/
? text-overflow:ellipsis;/*文本超出隱藏*/
? -o-text-overflow:ellipsis;/*跟上面一樣，只是為了兼容其他瀏覽器*/
? overflow:hidden;/*隱藏，跟text-overflow配合使用*/
}
上傳并預覽限制上傳數(shù)量
readAsDataURL(){
var result = document.getElementById("result");
if(typeof FileReader == 'undefined') {
result.innerHTML= "抱歉，你的瀏覽器不支持FileReader";
}
// 檢查是否為圖像類型
? var simpleFile = document.getElementById("file").files[0];
if(!/image\/\w+/.test(simpleFile.type)) {
alert("請確保文件類型為圖像類型");
return false;
}
var reader = new FileReader();
// 將文件以Data URL形式進行讀入頁面
? reader.readAsDataURL(simpleFile);
reader.onload= function(e){
// console.log(this.result);
? ? //創(chuàng)建新的img
? ? if (result.children.length== 1){
alert("最多長傳1張");
return;
};
var newNode = document.createElement("img");
newNode.src=this.result;
result.appendChild(newNode);
// console.log(result.children.length);
? }
}
//刷新當前組件 this.$router.go(0); return；
上傳文件
