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. 判断h5页面是小程序环境还是微信环境

    1.话不多说直接上代码,已使用有效 <script type="text/javascript" src="https://res.wx.qq.com/open/j ...

  2. 网络基础 05_DHCP

    1 DHCP概述 DHCP (Dynamic Host Configuration Protocol)是一种动态的向Internet终端提供配置参数的协议.在终端提出申请之后,DHCP可以向终端提供I ...

  3. order by中用子查询排序

    今天有个需求是对一个列表排序,但是排序字段是在另一个表中,不想用关联查询,就想能否直接在order by中用子查询,后来找到一个还挺好使.记录如下. 排序语句如下: select * from mai ...

  4. P1525 关押罪犯 题解

    #include<iostream> #include<cstdio> #include<algorithm> using namespace std; //带边权 ...

  5. USACO The Lazy Cow

    题目描述 这是一个炎热的夏天,奶牛贝茜感觉到相当的疲倦而且她也特别懒惰.她要在她的领域中找到一个合适的位置吃草,让她能吃到尽可能多的美味草并且尽量只在很短的距离.奶牛贝茜居住的领域是一个 N×N 的矩 ...

  6. 基于Cython和内置distutils库,实现python源码加密(非混淆模式)

    起因 python本身只能做混淆,不能加密,多年的商业软件开发经验导致有某种"洁癖"欲望,将py编译打包 尝试 pyinstaller原理是freeze打包pyc文件,利用工具可完 ...

  7. android:activity知识点

    一.活动流程 1.创建活动 public class firstActivity extends Activity{} 2.创建布局 新建first_layout.xml文件 3.注册活动 在andr ...

  8. Mac 10.12安装数据库管理工具MySQL Workbench

    说明:跨平台的MySQL管理工具.别纠结是不是反人类的了,这款用熟了也很溜. 下载: (链接: https://pan.baidu.com/s/1b3VtmA 密码: 6hka)

  9. Android:刚6瓶啤酒4两56度白酒下肚,居然20分钟做了一手机版网站 !

    刚6瓶啤酒4两56度白酒下肚,居然20分钟不到时间做了一手机版网站 !人有多大潜力你知道吗? 大家有兴趣的可以用手机或微信打开 http://xh.yunxunmi.com/  看看俺这酒后之做! 更 ...

  10. android中画弧函数canvas.drawArc()之理解

    在学习android中图形图像处理技术这部分内容时,对绘制圆弧函数canvas.drawArc()的用法.参数含义及画图原理很是不理解,在网上搜索了一些,加上自己的理解,在此做个小总结,作为学习过程中 ...