新手嘛,先学习下vue2.0新手入门—从环境搭建到发布

前端js 前端js     2022-08-30     537

关键词:

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新手入门—从环境搭建到发布(代码片段)

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

vue2.0新手完全填坑攻略—从环境搭建到发布

1.vue是一个前端框架  特点:    1.数据绑定(在页面上进行输入inputv-model=‘msg’,绑定到页面代码msg:‘hello’,js的变动绑定到页面上{{msg}},)    2.组件化    3.灵活的指令、操作页面。它本身强调的是组件化... 查看详情

vue2.0新手完全填坑攻略——从环境搭建到发布

 本文作者Jinkey(微信公众号jinkey-love,官网https://jinkey.ai)原文链接https://jinkey.ai/post/tech/vue2.0-xin-shou-wan-quan-tian-keng-gong-lue-cong-huan-jing-da-jian-dao-fa-bu文章允许非篡改署名转载,删除或修改本段版权信息转载的,视为侵犯知识产... 查看详情

vue2.0新手环境搭建

#vue2.0新手环境搭建1.安装node.js(稳定版本,>4.0.0即可)2.获取nodejs模块安装目录访问权限(windows跳过此步)sudochmod-R777/usr/local/lib/node_moudules ``` sudochmod-R777/usr/local/lib/node_moudules ```3.安装淘宝镜像 ``` npminstall-gcnpm `` 查看详情

vue2.0新手入坑环境搭建

 每周不定期更新 专业团队接APP外包联系QQ1129580542  vue-cli是一个官方发布vue.js项目脚手架,使用vue-cli可以快速创建vue项目,GitHub地址是:https://github.com/vuejs/vue-cli 一、安装node.js首先需要安装node环境,可以直接... 查看详情

搭建一个新手学习ai/ml的python环境

不知不觉消失了好久,公众号也很久没有更新了。因为跑去学习微软AI方向的MPP课程了。MPP是目前微软最先提供关于AI的培训课程,关于MPP的学习体系,我后面会再写一篇简单的介绍。????MPP包含了很多的内容,开始学习的时候速... 查看详情

大数据新手的0基础学习路线,从菜鸟到高手的成长之路

...为一个新兴的热门行业,吸引了很多人,但是对于大数据新手来说,按照什么路线去学习,才能够学习好大数据,实现从大数据菜鸟到高手的转变。这是很多想要学习大数据的朋友们想要了解的。今天我们就来和大家分享下大数... 查看详情

新手也能看懂的python开发环境搭建(代码片段)

看到有很多同学都想学Python,所以我来为大家介绍一下Python开发环境的搭建,帮助大家快速开始学习。安装Python环境手动下载安装Python要学习Python,第一件事情自然是安装Python了。访问下面的网页,点击最新版Pyth... 查看详情

新手如何学习数据库??

  很多新手在数据库学习的时候,由于学习难度较大,往往不知所措,打击学习的自信心,没有学习的兴趣,这些都是比较难避免的,下面就和大家分享一些学习的心得。  如果一点数据库知识也没有的话,先把你要学习的... 查看详情

新手入门指导:vue2.0的建议学习顺序

起步1.扎实的JavaScript/HTML/CSS基本功。这是前置条件。2.通读官方教程(guide)的基础篇。不要用任何构建工具,就只用最简单的<script>,把教程里的例子模仿一遍,理解用法。不推荐上来就直接用vue-cli构建项目,尤其是如果没有... 查看详情

新手上路——hadoop2.7.3单机模式环境搭建

目的本人是一只hadoop新手,本篇文章主要是个人学习hadoop的学习笔记,内容是搭建单机模式下hadoop2.7.3开发环境。搭建环境及所需软件VMWare12(64位),ubuntu-16.04(64位),hadoop2.7.3.tarHadoop简介Hadoop是... 查看详情

智能合约开发环境搭建及helloworld合约

...约的HelloWorld如何编写。开发环境搭建Solidity安装强烈建议新手使用Browser-Solidity来进行开发。Browser-Solidity是一个基于浏览器的So 查看详情

从零开始系列-caffe从入门到精通之一环境搭建

先介绍下电脑软硬件情况吧:处理器:Intel?Core?i5-2450MCPU@2.50GHz×4内存:4G操作系统:UbuntuKylin(优麒麟)16.04LTS64位 下面就是详细的安装过程(使用CPU,不使用GPU):点击这里查看原文。第一步:sudoapt-getinstalllibprotobuf-devlibleveldb-... 查看详情

java新手从入门到精通的学习建议

万事入门难。当你敲起helloworld跑起来,那其实算不上入门。论上入门应该是把Java的基础都掌握吧。javaSE是java的核心和基础。只有这块学好在后面阅读其他代码、框架才能更加轻松容易。java学习几点建议弄清Java编程的特点,确... 查看详情

智能合约开发环境搭建及helloworld合约(代码片段)

...约的HelloWorld如何编写。开发环境搭建Solidity安装强烈建议新手使用Browser-Solidity来进行开发。Browser-Solidity是一个基于浏览器的So 查看详情

2018年12月学习资源留存

Verilog的150个经典设计实例SublimeTextwebstorm等编译器快速编写HTML/CSS代码的技巧10分钟了解JSONWeb令牌(JWT)LeetCodeAllinOne题目讲解汇总(持续更新中...)Vue2.0小白入门教程(最全)整合Django+Vue.js框架快速搭建web项目Vue.js+Element.ui从搭建环境... 查看详情

从入门到入土大数据学习最简单windows下idea运行调试spark程序(代码片段)

从入门到入土大数据学习(4)windows下idea运行spark程序继环境搭建和windows环境搭建之后,不可避免的需要在windows上进行开发,但是这种跨平台的开发本身就给开发者带来一定的难度。如果条件允许(指电脑内存足够大&#x... 查看详情

vuejs从入门到精通(代码片段)

...精通001课程简介002vue简介003Vue官网使用指南004搭建Vue开发环境005Hello小案例006分析Hello案例007模板语法008数据绑定009el与data的两种写法010理解MVVM011Object.define013Vue中的数据代理014事件处理015事件修饰符016键盘事件0 查看详情