入门 Vue.js会碰到的常见问题

5510 次阅读 zuley 发布于 3年前 (2016-09-09) 前端开发 4 COMMENTS

搭建好Vue项目后我做的第一件事情就是先把Vue官网的起步例子都手写一遍下来跑一篇,然后记录下了一些新手会遇到的一些常见问题

入门 Vue.js会碰到的常见问题

经过了上一篇《使用Vue-cli构建Vue项目后》,已经可以搭建出了一个空白的Vue项目了。我们现在就可以阅读Vue官方的手册,照着他写一些简单的例子。

搭建好Vue项目后我做的第一件事情就是先把Vue官网的起步例子都手写一遍下来跑一篇,然后记录下了一些新手会遇到的一些常见问题千万不要复制代码,要自己手写

空格问题,导致编译出错。

Vue.js 对代码要求非常严格,必须按照格式写。我照着官网写的第一个Hello World就编译报错了。

对象赋值空格

# 正确示范
new Vue({
    el: '#app'
})

# 错误示范
new Vue({
    el : '#app'
})

所有以对象属性赋值的操作,都必须以属性名:(空格)值的形式书写,属性名与冒号之间不能有空格,冒号与值之间必须有空格。

# 正确示范
{ text: 'abc' }
# 错误示范,以下三种均是错误的
{ text : 'abc' }
{text: 'abc'}
{ text: 'abc'}

运算符空格

使用=或者+等运算符的时候两边必须有空格

# 正确示范
var a = '123'
#错误示范
var a= '123'
var a ='123'

函数空格

()两边都必须加空格,没有参数的时候括号内部不能有空格

# 正确示范
function fun () { ... }
# 错误示范
function fun(){ ... }
function fun ( ) { ... }

有多个参数的时候,分隔符右侧必须有空格,左边不能有空格

# 正确示范
function fun (a, b) { ... }
# 错误示范
function fun (a , b) { ... }
function fun (a ,b) { ... }

其他空格

iffor语句的空格处理办法和上面函数是一样的,这里就不多说,尝试一遍就清楚了

分号结束符

以前写JS的时候,喜欢在每一行的结束加上;作为结束,但是这里就不用了。如果写了反而会报错。

# 正确示范
var a = '123'
# 错误示范
var a = '123';

暂时碰到的问题就是这些,后面如果有新的问题,则在这里追加

二维码
扫描此二维码去手机端访问

入门 Vue.js会碰到的常见问题

文章评论

  1. 增达信购 2016-9-10 10:45 #1

    偶然来访,受益良多!

  2. muxiao 2016-9-10 14:02 #2

    博客重搞了还是域名换人了?

发表评论