哪位大佬能提供一个小demo,不胜感激
3条回答 默认 最新
- CSDN专家-showbo 2021-07-08 14:37关注
有帮助能点采纳吗,谢谢~
效果查看图片:https://img-mid.csdnimg.cn/release/static/image/mid/ask/1625726415615csdnuploader.gif<style> a{color:#f00} </style> <div id="app"> <div>{{word1.length>20&&State['word1']?word1.substring(0,20)+'...':word1}}<a v-bind:style="{display:word1.length>20?'inline':'none'}" v-on:click="toggle" rel="word1">{{State['word1']?'展开':'收起'}}</a></div> <div>{{word2.length>20&&State['word2']?word2.substring(0,20)+'...':word2}}<a v-bind:style="{display:word2.length>20?'inline':'none'}" v-on:click="toggle" rel="word2">{{State['word2']?'展开':'收起'}}</a></div> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> new Vue({ el: '#app', data: { word1: 'v-bind:style 的对象语法十分直观——看着非常像 CSS,但其实是一个 JavaScript 对象。', word2: '看着非常像 CSS', State: { word1: true, word2: true } }, methods: { toggle(e) { var a = e.target, rel = a.getAttribute('rel'); this.State[rel] = !this.State[rel]; } } }) </script>
本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 2无用
悬赏问题
- ¥15 Vue3 大型图片数据拖动排序
- ¥15 划分vlan后不通了
- ¥15 GDI处理通道视频时总是带有白色锯齿
- ¥20 用雷电模拟器安装百达屋apk一直闪退
- ¥15 算能科技20240506咨询(拒绝大模型回答)
- ¥15 自适应 AR 模型 参数估计Matlab程序
- ¥100 角动量包络面如何用MATLAB绘制
- ¥15 merge函数占用内存过大
- ¥15 使用EMD去噪处理RML2016数据集时候的原理
- ¥15 神经网络预测均方误差很小 但是图像上看着差别太大