vue动态绑定设置图片 src 路径
动态绑定图片URL地址显示。<img :src="imgURL" style="width: 25px;height: 25px; "/></span><img :src="more ? up : down " alt="">点击按钮,切换向上向下的箭头图标(图片),主要应用于,文字太长,省略号显示,点击箭头展开文字与收起文字功能。<template>
·
动态绑定图片URL地址显示。
<img :src="imgURL" style="width: 25px;height: 25px; "/></span>
<img :src="more ? up : down " alt="">
点击按钮,切换向上向下的箭头图标(图片),主要应用于,文字太长,省略号显示,点击箭头展开文字与收起文字功能。
<template>
<div @click="change">
<!-- 点击按钮,切换两个图片 -->
<img :src="more ? up : down " alt="">
</div>
</template>
<script>
// 下面是导入两张图片的相对地址
import up from '../static/icon/up.png'
import down from '../static/icon/down.png'
export default {
data () {
return {
more: false,
up: up,
down: down,
}
},
methods: {
change() {
this.more = !this.more
}
}
}
</script>
更多推荐
已为社区贡献4条内容
所有评论(0)