Vue2.0 新手入门 — 从环境搭建到发布

转自:http://www.runoob.com/w3cnote/vue2-start-coding.html

具体文章详细就不搬了,步骤可过去看,我这就写下使用总结

1. Vue2.0 推荐开发环境中一些安装就不说了

Node.js  、npm  、webpack  、vue-cli  , 自己看着安装

到最后能启动本地通过 vue-cli 建的项目,  npm run dev  ,默认的 http://localhost:8080/ 能看到页面显示

----------------------------

2. ide 工具, 我用的是 Webstorm ,找下 vue语法高亮显示

我的是 打开 Settings->Plugins 搜索安装 , 默认没有,browser

安装后,重启下 ide 软件,重新打开

这下看 vue 文件顺眼多了

----------

3.  文章中说的2个坑试下

第1个说 写2个并列div , 功能和展示正常

第2个 data 的格式,还是照着

默认的格式,正确的来

------------------

果然是新手,vue-resource 数据的, 尤其是异步加载数据显示的,还没整成功

网上找了个其他的,Vue2学习笔记:数据交互vue-resource http://www.cnblogs.com/zycbloger/p/6428014.html , 这个是点击后的数据alert ,

和交互还有点距离.

这个是点击按钮再进行的互动

-----------------

看到了其他的例子,能拿到数据了,中间也遇到几个问题:

1. 页面上老报 articles 未定义,   处理方式,在data的return里 加上 articles

2. 让页面加载直接拿数据, 放在 create中 就行

参考了这篇文章:  http://blog.csdn.net/MRblackLu/article/details/56286077 , 最终可以了,部分代码如下

能看到数据的调用和效果了

新手嘛,先学习下 Vue2.0 新手入门 — 从环境搭建到发布的更多相关文章

  1. 总结Vue 第四天:vue-cli(Vue2.0 新手入门 — 从环境搭建到发布)

    总结Vue 第四天:vue-cli(Vue2.0 新手入门 - 从环境搭建到发布) 一.Vue CLI----(Vue2.0 新手入门 - 从环境搭建到发布): ■   CLI是Command-Lin ...

  2. Vue2.0 新手入门 — 从环境搭建到发布

    什么是 Vue Vue 是一个前端框架,特点是数据绑定 比如你改变一个输入框 Input 标签的值,会自动同步更新到页面上其他绑定该输入框的组件的值 组件化 页面上小到一个按钮都可以是一个单独的文件. ...

  3. Selenium 2.0 + Java 入门之环境搭建

    最近在研究Java+Selenium的自动化测试,网上的资料比较多,自己测试实践后,整理出来一套相对比较完善的环境资料,因为网上很多下载实践的过程中,发现出现了很多不匹配的问题,什么jdk和eclip ...

  4. (一)windows7下solr7.1.0默认jetty服务器环境搭建

    windows7下solr7.1.0默认jetty服务器环境搭建 1.下载solr solr7官网地址:http://lucene.apache.org/solr/ jdk8官网地址:http://w ...

  5. Apache Spark1.1.0部署与开发环境搭建

    Spark是Apache公司推出的一种基于Hadoop Distributed File System(HDFS)的并行计算架构.与MapReduce不同,Spark并不局限于编写map和reduce ...

  6. Java开发学习心得(一):SSM环境搭建

    目录 Java开发学习心得(一):SSM环境搭建 1 SSM框架 1.1 Spring Framework 1.2 Spring MVC Java开发学习心得(一):SSM环境搭建 有一点.NET的开 ...

  7. Win7下单机版的伪分布式solrCloud环境搭建Tomcat+solr+zookeeper【转】

    Win7下单机版的伪分布式solrCloud环境搭建Tomcat+solr+zookeeper 1.软件工具箱 在本文的实践中,需要用到以下的软件: Tomcat-7.0.62+solr-5.0.0+ ...

  8. Windows Server 2003 IIS6.0+PHP5(FastCGI)+MySQL5环境搭建教程

    准备篇 一.环境说明: 操作系统:Windows Server 2003 SP2 32位 PHP版本:php 5.3.14(我用的php 5.3.10安装版) MySQL版本:MySQL5.5.25 ...

  9. Cocos2dx-3.0版本 从开发环境搭建(Win32)到项目移植Android平台过程详解

    作为重量级的跨平台开发的游戏引擎,Cocos2d-x在现今的手游开发领域占有重要地位.那么问题来了,作为Cocos2dx的学习者,它的可移植特性我们就需要掌握,要不然总觉得少一门技能.然而这个时候各种 ...

随机推荐

  1. Codeforces Round #517

    传送门 A. Cram Time 你有一本书,阅读第\(i\)页需要花费\(i\)的时间.你第一天有\(a\)的时间,第二天有\(b\)的时间,问你的总阅读页数的最大值. Input: 一行包含\(2 ...

  2. CF1139D Steps to One 题解【莫比乌斯反演】【枚举】【DP】

    反演套 DP 的好题(不用反演貌似也能做 Description Vivek initially has an empty array \(a\) and some integer constant ...

  3. 2019.04.11 第四次训练 【 2017 United Kingdom and Ireland Programming Contest】

    题目链接:  https://codeforces.com/gym/101606 A: ✅ B: C: ✅ D: ✅ https://blog.csdn.net/Cassie_zkq/article/ ...

  4. The Ugly Duckling

    THE UGLY DUCKLING   Chapter 1: The Ugly Duckling Hatches   A mother duck sits on many eggs.Crack! Cr ...

  5. java.lang.Exception: The server rejected the connection: None of the protocols were accepted

    solution for this is from comment for https://issues.jenkins-ci.org/browse/JENKINS-29616. The follow ...

  6. 不依赖JQuery的入门Ajax代码

    今天看了head first ajax这本书里ajax的实例,讲的很好,这本书觉着很不错,推荐下. Ajax (Asynchronous Javascript and XML)即异步Javascrip ...

  7. 如何写出优雅的JavaScript代码 ? && 注释

    如何写出优雅的JavaScript代码 ? 之前总结过一篇<如何写出优雅的css代码?>, 但是前一段时间发现自己的js代码写的真的很任性,没有任何的优雅可言,于是这里总结以下写js时应当 ...

  8. 【JSP】jsp报错:Syntax error, insert "}" to complete MethodBody

    使用MyEclipse编写JSP的时候有时会报错误如下 Syntax error, insert "}" to complete MethodBody 大体意思就是说方法体缺少缺少 ...

  9. SymbolTable

    在ClassReader中有两个重要的属性,如下定义: /** A hashtable containing the encountered top-level and member classes, ...

  10. 《python灰帽子》学习笔记:调试器设置

    一.构造 C  数据类型 C Type | Python Type | ctypes Type ____________________________________________________ ...