vue语法之拼接字符串的示例代码


Posted in Javascript onOctober 25, 2017

本文介绍了vue语法之拼接字符串的示例代码,分享给大家,具体如下。

先来一行代码:

<div class="swiper-slide" v-for="item in message">
<img v-bind:src="['xxx(需要拼接的字符串)'+item.picurl]" alt="" width="100%" height="245" />
</div>

如代码所示,只需要在数组语法中拼接字符串即可。

***知识点***

顺便总结一下vue语法

写法也分为:style的绑定和class的绑定

(以下代码部分为官网例子)

(1)对象语法

顾名思义,就是有使用对象写法的语法

style绑定:

vue语法之拼接字符串的示例代码

这类写法和css写法类似

class绑定:

vue语法之拼接字符串的示例代码

active是类名,isActive为true的时候active有效

(2)数组语法

style绑定:

<div :style="[style1,style2,style3]"></div>

data写法官网没介绍,我这边简单写一下例子:

data: {
  style1:{background:'red'},
  style2:{width:'100px'},
  style3:{height:'100px'}
 }

class绑定:

vue语法之拼接字符串的示例代码

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquerymobile局部渲染的各种刷新方法小结
Mar 05 Javascript
基于iframe实现类似于ajax的页面无刷新
May 31 Javascript
JavaScript中关联原型链属性特性
Feb 13 Javascript
JavaScript学习笔记之数组的增、删、改、查
Mar 23 Javascript
Bootstrap每天必学之级联下拉菜单
Mar 27 Javascript
jQuery中数据缓存$.data的用法及源码完全解析
Apr 29 Javascript
Bootstrap 最常用的JS插件系列总结(图片轮播、标签切换等)
Jul 14 Javascript
JavaScript实现广告弹窗效果
Aug 09 Javascript
AngularJs 国际化(I18n/L10n)详解
Sep 01 Javascript
javascript中BOM基础知识总结
Feb 14 Javascript
详解在vue-cli项目中安装node-sass
Jun 21 Javascript
Vue动态组件与异步组件实例详解
Feb 23 Javascript
浅谈Vue.nextTick 的实现方法
Oct 25 #Javascript
纯html+css+javascript实现楼层跳跃式的页面布局(实例代码)
Oct 25 #Javascript
浅谈Node.js之异步流控制
Oct 25 #Javascript
AngularJS 实现购物车全选反选功能
Oct 24 #Javascript
React Native时间转换格式工具类分享
Oct 24 #Javascript
vue+vuecli+webpack中使用mockjs模拟后端数据的示例
Oct 24 #Javascript
React Native AsyncStorage本地存储工具类
Oct 24 #Javascript
You might like
如何把PHP转成EXE文件
2006/10/09 PHP
PHP 正则表达式之正则处理函数小结(preg_match,preg_match_all,preg_replace,preg_split)
2012/10/05 PHP
解析如何通过PHP函数获取当前运行的环境 来进行判断执行逻辑(小技巧)
2013/06/25 PHP
php获取表单中多个同名input元素的值
2014/03/20 PHP
11个PHPer必须要了解的编程规范
2014/09/22 PHP
Laravel使用memcached缓存对文章增删改查进行优化的方法
2016/10/08 PHP
PHP切割整数工具类似微信红包金额分配的思路详解
2019/09/18 PHP
非常好的js代码
2006/06/27 Javascript
FLASH 广告之外的链接
2008/12/16 Javascript
checkbox 复选框不能为空
2009/07/11 Javascript
vs2003 js文件编码问题的解决方法
2010/03/20 Javascript
js获取dom的高度和宽度(可见区域及部分等等)
2013/06/13 Javascript
js+html5实现canvas绘制镂空字体文本的方法
2015/06/05 Javascript
深入解析JavaScript中的数字对象与字符串对象
2015/10/21 Javascript
JS+CSS实现的竖向简洁折叠菜单效果代码
2015/10/22 Javascript
如何使用jquery修改css中带有!important的样式属性
2016/04/28 Javascript
基于vue的fullpage.js单页滚动插件
2017/03/20 Javascript
基于vue2的canvas时钟倒计时组件步骤解析
2018/11/05 Javascript
JS中数据结构之栈
2019/01/01 Javascript
微信小程序实现电影App导航和轮播
2020/11/30 Javascript
Python抓取淘宝下拉框关键词的方法
2015/07/08 Python
python+django+sql学生信息管理后台开发
2018/01/11 Python
Django 跨域请求处理的示例代码
2018/05/02 Python
python实现扫描ip地址的小程序
2019/04/16 Python
Pytorch修改ResNet模型全连接层进行直接训练实例
2019/09/10 Python
python GUI库图形界面开发之PyQt5动态加载QSS样式文件
2020/02/25 Python
解决Python paramiko 模块远程执行ssh 命令 nohup 不生效的问题
2020/07/14 Python
用Python进行websocket接口测试
2020/10/16 Python
HTML5新标签兼容——&gt; 的两种方法
2018/09/12 HTML / CSS
销售行业个人求职自荐信
2013/09/25 职场文书
医护人员英文求职信范文
2013/11/26 职场文书
函授毕业生的自我鉴定
2013/11/26 职场文书
村干部承诺书
2014/03/28 职场文书
大跃进口号
2014/06/16 职场文书
联谊活动总结范文
2015/05/09 职场文书
pytorch 实现在测试的时候启用dropout
2021/05/27 Python