weex-修改style的几种方法
方法 修改 几种 Style weex
2023-09-11 14:21:22 时间
对于不熟悉weex和js的人来说,初学weex不知道怎么来修改style,即使网上查了,也很难查找到需要的信息,好不容易查到了还是js里面的东西,还不确定weex是否支持,这里,博主经过才坑,总结了两种方法来修改style,效果见下图:
这里采用两种方法来修改style:
1.通过elementById的方法:
changeColor() {
document.getElementById('haha').style.backgroundColor = 'blue'
}//注:此方法只对web上运行的项目有用,客户端无效
2.通过refs获取到模块,通过animation操作改变style
animation.transition(this.$refs.haha,{
styles:{
width: '400px'
},
duration: 0,
timingFunction: 'ease',
delay: 0
}, function(){
})
当然,改变style的方法绝不止这两种,博主在以后的学习中发现新的方法会对这篇博客进行更新。如果你有更好的方法也欢迎留言和博主一起讨论。
详细代码可以查看博主的Demo:点击下载
此处为更新
1.其实还有一种方法,但是个人不提倡,将样式写在标签内部,值给变量,在data中给变量赋值,如果样式设置比较少倒是可以,但要是多的话,标签会非常难看,代码不易读,但也权且算是一种方法:
<text class="content" ref="contentRef" :style="{ lines: limitLine }">{{desc}}</text>
data中对limitLine赋值,this.limitLine=x来修改。
2.绑定class,此方法可查看:http://dotwe.org/vue/228cecf736e2cf08190d8c128cae6bc2
weex有提供这个方法,直接过去看即可,针对改动比较大的样式变动。
相关文章
- DeepNLP的核心关键/NLP词的表示方法类型/NLP语言模型 /词的分布式表示/word embedding/word2vec
- 我的5次测试遗漏解决方法及事后分析
- 3种方法修改PHP时区
- Python 修改文件内容3种方法(替换文件内容)
- keil mdk编译器学习笔记(5)——如何确保某一段程序不被优化掉 使用keil判断ARM的冷启动和热启动的方法
- 解决URLClassLoader使用addURL方法失效的问题
- 渗透测试-跨站请求伪造(CSRF)之修改密码及防御方法
- 《软件工程方法与实践》—— 1.4 软件工程的基本原理与基本原则
- centos修改主机名的正确方法
- 环境变量配置步骤(误删除找回方法)
- Linux中修改环境变量及生效方法
- 关闭 You need to use a Theme.AppCompat theme (or descendant) with this activity解决方法
- Idea-每次修改JS文件都需要重启Idea才能生效解决方法
- RabbitMQ中客户端的Channel类里各方法释义
- 用VSCode连接远程Linux服务器实时修改代码的方法
- Android手机修改Hosts的方法
- linux查看和修改PATH环境变量的方法
- 导致页面顶部空白一行解决方法
- js数组方法汇总
- 四轴飞行器偏航角不同飞控的C语言实现方法
- 设计模式(四)工厂方法模式
- ORA-12560: TNS: 协议适配器错误的解决方法
- Bugfree如何修改Bug7种解决方案的标注方法
- Linux修改时间的方法
- Unity Android 之 获取系统Calendar 日历日程 (涉及指定日期时间判断是星期几的方法使用)的方法整理
- 成就Facebook 社交帝国的女人:我的3个战胜困境的方法
- 【龙芯1B ide技巧】:loong1.2.beta1版本编译器出现,修改库文件之后编译无法通过,并且提示删除的库文件还在,以下提供解决方法
- windows及linux环境下永久修改pip镜像源的方法
- sql server 每日备份:新手遇到的问题解决方法(一)
- IDEA类和方法注释模板