非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 框架,简单易上手不说,教程详尽 ...
随机推荐
- ELK 实现 Java 分布式系统日志分析架构
日志是分析线上问题的重要手段,通常我们会把日志输出到控制台或者本地文件中,排查问题时通过根据关键字搜索本地日志,但越来越多的公司,项目开发中采用分布式的架构,日志会记录到多个服务器或者文件中,分析问题 ...
- 深入浅出DOM基础——《DOM探索之基础详解篇》学习笔记
来源于:https://github.com/jawil/blog/issues/9 之前通过深入学习DOM的相关知识,看了慕课网DOM探索之基础详解篇这个视频(在最近看第三遍的时候,准备记录一点东西 ...
- maven groupID 和 ArtifactID的区别与作用
GroupID是项目组织唯一的标识符,实际对应JAVA的包的结构,是main目录里java的目录结构. ArtifactID就是项目的唯一的标识符,实际对应项目的名称,就是项目根目录的名称.一般Gro ...
- Category 的一些事
来源:伯乐在线 - Tsui YuenHong 链接:http://ios.jobbole.com/90422/ 点击 → 申请加入伯乐在线专栏作者 新增实践部分:偏方 Hook 进某些方法来添加功能 ...
- 树莓派进阶之路 (019) - 树莓派通过filezilla,samba与PC文件共享(转)
虽然我们可以很方便的通过ssh譬如putty或者vnc连接操控树莓派,但是毕竟树莓派资源没那么高,在上面编程,调试要吃力的多.所以还是想在pc上编程上传到树莓派或者最好,文件共享,可以直接读写共同的文 ...
- Socket的综合应用总结
Socket 的传输的内容大概分3种: 封装的结构体:结构体(结构清晰,发送数据占用内存小),例如 struct SOCKETDATA { DWORD password; //每个客户端 ...
- 归并排序(C++实现)
归并排序是利用"归并"技术来进行排序.归并是指将若干个已排序的子文件合并成一个有序的文件.常见的归并排序有两路归并排序(Merge Sort),多相归并排序(Polyph ...
- 纯CSS兑现侧边栏/分栏高度自动相等(转)
这里直接介绍我认为的最佳的侧边栏/分栏高度自动相等方法.核心的CSS代码如下(数值不固定): margin-bottom:-3000px; padding-bottom:3000px; 再配合父标签的 ...
- Python学习笔记001——Linux
Linux文件系统采用树形目录结构,系统中一切皆文件.文件名字母区分大小写 Linux命令使用格式(终端窗口) 命令名 [选项] [参数] 命令名:在命令行输入命令. 备注:命令名字母区分大小写, 1 ...
- mysql 创建函数问题
ERROR 1418 (HY000): This function has none of DETERMINISTIC, NO SQL, or READS SQL DATA in its declar ...