当有时候需要在页面显示时显示空格时,可以使用 ,但是使用这个占位符时,无论写多少个,就只能显示一个空格。要想显示多个空格进行占位,这种方式显然是可行的,解决方法是使用转义字符。

先看代码:

<template>
<div>
<el-row style="background-color: rgb(118, 118, 233);">
<el-col :span="10">&nbsp;</el-col>
<el-col :span="5">你好</el-col>
</el-row>
<el-row style="background-color: rgb(0, 195, 255);">
<el-col :span="10" v-html="'\u00a0'"/>
<el-col :span="5">你好</el-col>
</el-row>
</div>
</template>

效果图:

根据图可以发现,当使用&nbsp;占位时并不会显示出来,用v-html和转义字符结合便可达到效果。

其中'\u00a0'是'nbsp'的16进制表示,也可以使用下表的值:

'nbsp' '\u00a0'
'ensp' '\u2002'
'emsp' '\u2003'

Vue使用&nbsp空白占位符的更多相关文章

  1. [占位符 &nbsp; ]

    在做项目的时候,数据库中的数据会存在空值;这样,我们需要在前台给它加以判断, 如果我们不加以判断也是可行的,我们需要添加一个空白占位符  空白占位符 是个不错的选择,这样我们的页面显示数据的时候就不会 ...

  2. wpf 空白汉字占位符

    <TextBlock xml:space="preserve" Text="主  编" />   表示一个汉字占位符

  3. 【GoLang】GoLang fmt 占位符详解

    golang 的fmt 包实现了格式化I/O函数,类似于C的 printf 和 scanf. # 定义示例类型和变量 type Human struct { Name string } var peo ...

  4. es6 模板字变量和字符串占位符

    开发者一直在寻找一种创建多行字符串的形式,但要使用单引号双引号字符串一定要在同一行才行. 老办法: 还有其他办法,虽然能实现,但是太啰嗦 es6模板自变量 使用反撇好(`)替换了单双引号 反撇好中的所 ...

  5. golang fmt格式“占位符”

    # 定义示例类型和变量 type Human struct { Name string } var people = Human{Name:"zhangsan"} 普通占位符 占位 ...

  6. golang fmt占位符

    golang fmt格式"占位符" golang 的fmt 包实现了格式化I/O函数,类似于C的 printf 和 scanf. 定义示例类型和变量 type Human stru ...

  7. 占位符golang

    定义示例类型和变量 type Human struct { Name string } var people = Human{Name:"zhangsan"} 普通占位符 占位符 ...

  8. golang fmt格式占位符

    golang 的fmt 包实现了格式化I/O函数,类似于C的 printf 和 scanf. # 定义示例类型和变量 type Human struct { Name string } var peo ...

  9. Python全栈工程师(while、占位符)

    ParisGabriel     Python 入门基础         UnicodeASCII 用8个位表示文字 ,最高位一定是零,低七位表示数值Unicode是由16个位组成的(65535) 最 ...

随机推荐

  1. SANGFOR AC配置AD域单点登录(一)----AC侧配置

    一.需求 1. AD域单点登录适用于客户内网已有AD域统一管理内网用户,部署AC后,希望AC和AD域结合实现平滑认证.即终端PC开机通过域帐号登录AD域后自动通过AC认证上网,无需再次人为通过AC认证 ...

  2. 5.2 spring5源码--spring AOP源码分析二--切面的配置方式

    目标: 1. 什么是AOP, 什么是AspectJ 2. 什么是Spring AOP 3. Spring AOP注解版实现原理 4. Spring AOP切面原理解析 一. 认识AOP及其使用 详见博 ...

  3. spark提交命令 spark-submit 的参数 executor-memory、executor-cores、num-executors、spark.default.parallelism分析

    转载:https://blog.csdn.net/zimiao552147572/article/details/96482120 nohup spark-submit --master yarn - ...

  4. Codeforces Round #651 (Div. 2) B. GCD Compression(数论)

    题目链接:https://codeforces.com/contest/1370/problem/B 题意 给出 $2n$ 个数,选出 $2n - 2$ 个数,使得它们的 $gcd > 1$ . ...

  5. 【noi 2.6_6049】买书(DP)

    题意:有N元,有无限多本10.20.50和100元的书,问有几种购买方案. 解法:f[i]表示用 i 元的方案数.还有一个 j 循环这次买多少元的书. 注意--要先 j 循环,再 i 循环.因为要先考 ...

  6. 2020 年百度之星·程序设计大赛 - 初赛一Dec 简单dp

    题意: Problem Description 初始有 a, ba,b 两个正整数,每次可以从中选一个大于 1 的数减 1,最后两个都会减到 1,我们想知道在过程中两个数互质的次数最多是多少. Inp ...

  7. Jmeter入门使用

    1. 什么是Jmeter 转自:https://www.cnblogs.com/lijuanhu321/p/9537185.html#testComponent https://www.cnblogs ...

  8. OpenStack Train版-13.安装块存储服务cinder(控制节点)

    Cinder的核心功能是对卷的管理,允许对卷.卷的类型.卷的快照.卷备份进行处理.它为后端不同的存储设备提供给了统一的接口,不同的块设备服务厂商在Cinder中实现其驱动,可以被Openstack整合 ...

  9. python--通过ocr对数据可视化视频还原为csv,进行简单的分析

    见github https://github.com/TouwaErioH/Machine-Learning/tree/master/video/video 题目描述: source https:// ...

  10. Invalid prop: custom validator check failed for prop "***"

    使用element ui时,绑定参数参考官方参数说明,比如progress的status 值必须是在以下三个里面选择 "success/exception/text", 其它情况可 ...