非nodejs方式的vue.js的使用
1、node环境
详细见我之前的文章,node的安装
2、git环境
git bash命令窗,支持bash命令,cmd不支持bash命令
3、cnpm安装
cnpm是针对国内使用npm网络慢的而使用的
在cmd中输入:
npm install -g cnpm --registry=https://registry.npm.taobao.org
如果node的版本比较低,会执行不成功。需要升级node的版本,直接下载最新的node覆盖安装
4、下载vue.min.js和vue-resource.min.js
这是使用cnpm的方式
打开git bash,输入:cnpm install vue
输入:cnpm install vue-resource
将下载到的vue.min.js和vue-resource.min.js放到项目中
5、截图说明
将title的值在data中绑定为hello vue,然后执行cartView方法,将title值修改为Vue hello


6、index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"> <meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0">
<title>Title</title>
</head>
<body>
<div id="app">
<h2>{{title}}</h2> </div>
<script src="js/lib/vue.min.js"></script>
<script src="js/lib/vue-resource.min.js"></script>
<script src="js/cart.js"></script>
</body>
</html>
7、cart.js
/**
* Created by kk on 2017/4/16.
*/
var vm =new Vue({
el:"#app",
data:{
title:"hello vue"
},
filters:{ },
mounted:function () {
//类似于jquery中的ready方法
this.cartView();
},
methods:{
cartView:function () {
this.title="Vue hello"
}
} });
非nodejs方式的vue.js的使用的更多相关文章
- 组件切换方式(Vue.js)
这里,我用一个注册登录两组件的切换实例来演示: 切换方式一 <!DOCTYPE html> <html lang="zh-CN"> <head> ...
- vue.js插入dom节点的方式
html代码: <div id="app"></div> js代码: var MyComponent = Vue.extend({ template: '& ...
- vue.js环境安装
1.到官网(http://nodejs.cn/download/)下载Node.JS运行环境并安装(由于现在的Node中自带npm包管理器,所以就不需要额外下载npm了) 2.如果是新手,那么建议以引 ...
- Vue.js+vue-element搭建属于自己的后台管理模板:什么是Vue.js?(一)
Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js是什么?(一) 前言 本教程主要讲解关于前端Vue.js框架相关技术知识,通过学习一步一步学会搭建属于自己的后台管理模板,并 ...
- Vue.js入门指南(一)
前 言 JRedu 之前用过一段时间的AnglarJS 1.X,在低版本的AngularJS中,脏值检查在变量增多的情况下会影响程序的响应速度.后期的2.X和更高版本在脏值检查等问题上做了优化, ...
- .Net Core+Vue.js+ElementUI 实现前后端分离
.Net Core+Vue.js+ElementUI 实现前后端分离 Tags: Vue 架构 前端采用:Vue.js.Element-UI.axios 后端采用:.Net Core Mvc 本项目是 ...
- Vue.js高效前端开发 • 【初识Vue.js】
全部章节 >>>> 文章目录 一.Vue概述 1.Web前端框架介绍 2.MVC和MVVM 3.Vue介绍 4.安装Vue 二.Vue使用 1.第一个Vue应用 2.Vue的双 ...
- 基于 Vue.js 之 iView UI 框架非工程化实践记要
像我们平日里做惯了 Java 或者 .NET 这种后端程序员,对于前端的认识还常常停留在 jQuery 时代,包括其插件在需要时就引用一下,不需要就删除.故观念使然,尽管 Nuget 和 Maven ...
- 【Vue课堂】Vue.js 父子组件之间通信的十种方式
这篇文章介绍了Vue.js 父子组件之间通信的十种方式,不管是初学者还是已经在用 Vue 的开发者都会有所收获.无可否认,现在无论大厂还是小厂都已经用上了 Vue.js 框架,简单易上手不说,教程详尽 ...
随机推荐
- swift3 生成UUID
swift3 生成UUID //获取UUID func getUUID() -> String { let uuidRef = CFUUIDCreate(nil) let uuidStringR ...
- linux shell 脚本攻略学习17--正则表达式入门
正则表达式(也称为“regex”或“regexp”)是一种用来描述文本模式的特殊语法.在 Linux 系统上,正则表达式通常被用来查找文本的模式,以及对文本流执行“搜索-替换”操作以及其它功能. 正则 ...
- Windows 7系统如何设置计划任务?
Windows 7系统如何设置计划任务? 问题描述:Windows 7系统如何设置计划任务? 任务计划概述:任务计划,可以将任何脚本.程序或文档安排在某个时间运行.“任务计划”在每次启动windows ...
- Elasticstack 5.1.2 集群日志系统部署及实践
Elasticstack 5.1.2 集群日志系统部署及实践 一.ELK Stack简介 ELK Stack 是Elasticsearch.Logstash.Kibana三个开源软件的组合,在实时数据 ...
- VC设置视图背景颜色方法
视图的背景一般来说是白色的,在缺省情况下,它和系统定义的颜色COLOR_WINDOW是一致的.设计者一般会希望自己的程序可以让用户轻松地改变窗口背景颜色,或是用漂亮的图片来充填背景.我们可以用Wind ...
- Entity Framework中实体模型命名空间的问题
在添加一个实体数据模型的时候(就是扩展名为edmx那位)属性里明明设置了自己的命名空间,但是后台的Designer.cs命名空间生成规则却是项目的默认命名空间加edmx文件所在文件夹的名称, 是BUG ...
- app-framework学习--官网地址及demo下载地址
一起学习共同进步,加油..! 官网地址:http://app-framework-software.intel.com/ 下载地址:http://download.csdn.net/detail/ha ...
- PostgreSQL基础命令
1. 查看数字库和表 切换用户postgres su postgres 执行psql进入后台(就像执行mysql进入后台一样) 2. 更新postgres密码 \password 3. 创建数据库用户 ...
- 手把手带你画一个 时尚仪表盘 Android 自己定义View
拿到美工效果图.咱们程序猿就得画得一模一样. 为了不被老板喷,仅仅能多练啊. 听说你认为前面几篇都so easy,那今天就带你做个相对照较复杂的. 转载请注明出处:http://blog.csdn.n ...
- Ubuntu 13.04开机亮度调节
终于把我的T430换成Ubuntu,本来还打算等几天13.10,想想反正能升级,趁着101长假就抓紧换了吧~` 总体来说遇到的问题不是很多,可能是Thinkpad在Linux或者ubuntu的方面做的 ...