vue中:style的用法,axios传参方式,js获取对象变量名

1.input框设置user-select:none后不生效

2.下载图片

// 下载图片
downloadByBlob(url, name) { // 下载本地文件
  const image = new Image()
  image.setAttribute('crossOrigin', 'anonymous')
  image.src = url
  image.onload = () => {
    const canvas = document.createElement('canvas')
    canvas.width = image.width
    canvas.height = image.height
    const ctx = canvas.getContext('2d')
    ctx.drawImage(image, 0, 0, image.width, image.height)
    canvas.toBlob((blob) => {
      const url = URL.createObjectURL(blob)
      this.download(url, name)
      // 用完释放URL对象
      URL.revokeObjectURL(url)
    })
  }
},


download(href, name) {
  const eleLink = document.createElement('a')
  eleLink.download = name
  eleLink.href = href
  eleLink.click()
  eleLink.remove()
},

3.vue 中 :style 的用法

1.普通用法

<p :style{fontFamily:arr.conFontFamily,color:arr.conFontColor,backgroundColor:arr.conBgColor}">

{{con.title}}</p>

2.三元运算

< p :style="{fontFamily:arr.conFontFamily,fontSize:(arr.conFontSize!=0.36?arr.conFontSize+arr.conFontUnit:''),color:arr.conFontColor,backgroundColor:arr.conBgColor}">{{con.title}}</p>

3.结合计算属性 将样式都提出来 最后形成一个变量 把这个变量添加到div上

data(){
    return {
        arr:{
            styles:{
                //存放的是 动态修改的样式
                conTitleStyle:{},// 内容标题总样式
                conLiStyle:{},//内容li总样式
                
            },
            pieceStyle:{
                conFontFamily:"",
                conFontSize:16,
                conFontColor:"",
                conBgColor:"",
                conLineHeight:21,// Writing 专用
                conLRCenter:"",// 对齐方式 
                conTopRow:0,//首行缩进 
                conLetterSpace:0,//字体间隔 
                conFontBold:"",//加粗 
                conSpace:""//文字是否省略 
            }
        }
    }
},
// 使用
<p :style="arr.styles.conTitleStyle">{{con.title}}</p>
<p :style="[arr.styles.conTitleStyle,arr.styles.conLiStyle]">{{con.title}}</p>

4.axios传参方式

1.get:

axios({
    method: 'get',
    url: '/user',
    params: {
    firstName: 'XXX',
    lastName: 'XXX'
  }
  })

2.post

axios({
  method: 'post',
  url: '/user',
  data: {
    firstName: 'XXX',
    lastName: 'XXX'
  }
});

3.axios.get

axios.get('/user', {  //params参数必写 , 如果没有可传参数，传{}以
    params: {  
    firstName: 'XXX',
    lastName: 'XXX'
    }
})

4.axios.post

axios.post('/user', { 
	firstName: 'XXX',
    lastName: 'XXX'}
    )
    

5.event.returnvalue = false;代表不接受事件的返回值

6.JS获取对象的变量名转字符串

function getVarName(namedVar){
    for (var key in window){
    if (window[key] === namedVar) return key;
    }
}

使用方法：
str = getVarName(obj); //get var obj name
console.log(“the obj name is :”+str)