vue强制绑定css3的缩放效果transfrom:scale()
vue不提供 transfrom:scale(1.5) ; 会报错 ,错误是 "TypeError: _vm.scale is not a function";
原因:Vue将其误认为scale是函数
解决方法:可以使用模板字符串
<template>
<div class="wrap" ref="message" :style="scaleFun"> <!--这里注意没有{},不能写成{sss} -->
<div class="bigPic"></div>
</div>
</template> <script>
export default {
data(){
return {
scale:0.5,
}
},
computed:{
scaleFun:function () {
var scale = this.scale;
return `transform:scale(${scale})`
}
}
}
</script>
vue强制绑定css3的缩放效果transfrom:scale()的更多相关文章
- (尚007)Vue强制绑定class和style
注意:class和style的值是动态的值 1.test007.html <!DOCTYPE html><html lang="en"><head&g ...
- CSS3旋转缩放移动倾斜等效果——transform
1.transform浏览器支持情况 也就是说目前不考虑老浏览器的话是不用加前缀的,感谢菜鸟教程:https://www.runoob.com/cssref/css3-pr-transform.htm ...
- css3实现动画效果
一.动画效果的常用属性 实现动画效果需要借助css3的下列属性:transform,transion,animation(具体可以参见教材) 二.动画效果实例 1)文字闪烁的动画效果 /*文字的闪烁效 ...
- css3的transition效果和transfor效果
<!doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...
- vue双向绑定的原理及实现双向绑定MVVM源码分析
vue双向绑定的原理及实现双向绑定MVVM源码分析 双向数据绑定的原理是:可以将对象的属性绑定到UI,具体的说,我们有一个对象,该对象有一个name属性,当我们给这个对象name属性赋新值的时候,新值 ...
- 基于Vue的页面切换左右滑动效果
HTML文本页面: <template> <div id="app> <transition :name="direction" mode= ...
- Vue双向绑定原理,教你一步一步实现双向绑定
当今前端天下以 Angular.React.vue 三足鼎立的局面,你不选择一个阵营基本上无法立足于前端,甚至是两个或者三个阵营都要选择,大势所趋. 所以我们要时刻保持好奇心,拥抱变化,只有在不断的变 ...
- vue双向绑定原理及实现
vue双向绑定原理及实现 一.总结 一句话总结:vue中的双向绑定主要是通过发布者-订阅者模式来实现的 发布 订阅 1.单向绑定和双向绑定的区别是什么? model view 更新 单向绑定:mode ...
- 《JavaScript 实战》:JavaScript 实现拖拽缩放效果
拖拉缩放效果,实现通过鼠标拖动来调整层的面积(宽高)大小,例如选框效果.这里的拖拉缩放比一般的选框复杂一点,能设置八个方位(方向)的固定触发点,能设置最小范围,最大范围和比例缩放. 跟拖放效果一样,程 ...
随机推荐
- 修复lsp,360浏览器可以上网其它软件不行
netsh winsock reset netsh int ip reset 重启电脑
- Oracle PL/SQL开发基础(第三十四弹:RAISE_APPLICATION_ERROR)
RAISE_APPLICATION_ERROR在子程序内部使用时,能从存储子程序中抛出自定义的错误消息.这样就能将错误报告给应用程序而避免范围未捕获异常. 语法如下: RAISE_APPLICATIO ...
- mysql 各项操作流程
启动mysql:进入命令行输入:net start mysql 如果失败则显示:服务名无效,需跳转到指定Bin目录下进行启动mysql, 成功则进行下一步:登陆 :mysql -uroot -proo ...
- layer弹出框的用法
页面中引入 layer.js 就行了 1.弹出一个提示信息: layer.msg("我是哦提示信息"); 2.弹出一个带选择的按钮的框 layer.open({ title: ' ...
- Unity3D_脚本_获取对象的位置_碰撞后加一段音乐_旋转对象_使物体随机运动
获取对象的位置(Position) 在代码中加上 public Rigidbody cd;cd = GetComponent<Rigidbody>();Vector3 m=cd.trans ...
- Matrix(坑)
https://github.com/florent37/Android-3D-Layout
- 用div布局,页面copyright部分始终居于
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content=&q ...
- mysql数据库增量恢复
mysqldump -uroot -p -B discuzx -F -x --master-data=2 --events|gzip >/root/discuzx.sql.gz 写入数据 删除数 ...
- Spring学习总结(18)——Spring整合Mysql数据库一主多从、多主多从配置
一.新建jdbc.properties配置文件 master.jdbc.driverClassName=com.mysql.jdbc.Driver master.jdbc.url=jdbc:mysql ...
- jQuery(基本事件)