vue3中css里的v-bind
2023-06-13 09:11:18 时间
官方文档:状态驱动的动态 CSS
编写一个组件:
<template>
<div class="ruben">
<p>You clicked {{ count }} times</p>
<button @click="increment">Click me</button>
</div>
</template>
<script>
export default {
data() {
return {
count: 1
}
},
methods: {
increment() {
this.count++
}
}
}
</script>
<style scoped>
.ruben {
transform: scale(v-bind(count));
}
</style>
测试:
相关文章
- Vue3源码03: Vue3响应式核心原理
- css怎么改鼠标样式,如何利用CSS改变鼠标的样式
- vue3创建项目(二)router路由配置和使用
- vue3-Composition-API实操
- vue3的h函数以及tsx写法
- CSS 换行_css不允许换行
- Vue3学习Day1 有哪些新特性?解决了Vue2的那些问题?
- 前端必备的 CSS 库,normalize.css
- 【CSS教程】紫色渐变登陆布局html+css代码
- Vue2与Vue3的响应式【代理对象:Proxy 反射对象:Reflect的实例学习】
- vue3+ts项目安装路由
- CSS与MySQL合力提升网页性能(css与mysql结合)
- MySQL登陆系统CSS实现一键登录(css mysql登陆)
- CSS规则层叠的应用css必须要注意的几点
- CSS教程之css选择器、属性、值
- 简单的加密css地址防止别人下载你的CSS文件的方法