Vue.js学习之路（二）挂载点、数据对象

    

        {
    {message}}
    
    
    
    ​

 这个是上一篇文章中实现hello world程序的关键代码，上一次我们只是简单实现了这个功能，但是对于其中的关键字我们还不知道是什么意思。这篇文章我们就一一讲解。

一、el  挂载点

1、作用范围：el命中的元素内部。像上边的程序我们el命中的范围也就是id为app的那个div，当然，如果我们继续向其中嵌套动元素也是同样可以作用到的。

    

        {
    {message}}
        {
    {message}}
    

2、选择器：适用于所有选择器：id选择器（#），类选择器（.），标签选择器。

                    但是因为id在页面中是唯一的，所以一般建议使用id选择器。

3、可用于几乎所有标签，也就是说我们可以把上边的div，换成任何我们需要的dom元素。

      但是注意不要挂载到或者上

二、data 数据对象

在页面中定义的变量都会写在data中，像之前用过的message。除此之外，像数组、对象都是在data中进行定义的。

 1、使用数据的方法

    

     
 {
    {message}}  
     
 {
    {sport[0]}} 
     
 {
    {student.name}} 
     
 {
    {student.mobile}} 
    
    
    
    ​

• （基本数据类型）  { { 变量名 }}
• （数组类型）          借助下标——{ { 数组[0] }}
• （对象类型）          借助点语法——{ { 对象名.需要的项 }}

这里和其他.net 语言使用规则类似，就不过多解释。有一点不同就是直接使用双花括号  { {}}  进行变量使用。

注：每一个变量的声明之间用逗号隔开