本文主要是介绍开发中千万不要轻视空格，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
积跬步 至千里
简单例子
开发中由于自己的格式代码方式有问题，可能一不小心加了空格 ，有些加空格可能不受影响，但有些时候加空格就会出现失效，导致错误。
<template>
<div><el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button><el-dialogtitle="提示":visible.sync="dialogVisible"width="30%":before-close="handleClose"><span>这是一段信息</span><span slot="footer" class="dialog-footer"><el-button @click="dialogVisible = false">取 消</el-button><el-button type="primary" @click="dialogVisible = false">确 定</el-button></span>
</el-dialog>
</div></template>
<script>
export default {data() {return {dialogVisible: false};},methods: {handleClose(done) {this.$confirm('确认关闭？').then(_ => {done();}).catch(_ => { });}}
};
</script>以下是一个最简单的dialog 弹框，效果图如下 ：
出现BUG了
很久没有动的代码，竟然被报了bug，原因是 底部的按钮没了效果类似如下：
此时的代码
<span slot="footer " class="dialog-footer"><el-button @click="dialogVisible = false">取 消</el-button><el-button type="primary" @click="dialogVisible = false">确 定</el-button></span>说实话第一眼我没注意出来，就自己受用注释写了一遍，发现就好了，左看右看，右看左看，是 空格 惹的祸，slot 名称 footer 加了空格，所以名称匹配不上，就显示不出footer。
空格真的会惹来大麻烦
问题排查，是同事替代吗格式化问题，导致加了很多的空格，包括类名 监听的方法名 slot ref 等，测试了一下 class 方法名 后面加空格没受影响，但是 slot ,都受到了影响
所以没必要的空格 不管是哪都不要加了 ，特别是类似Id ref slot 需要精确匹配的更要注意。
这篇关于开发中千万不要轻视空格的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
