vue官网说：Vue.js（读音 /vjuː/，类似于 view） 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。
渐进式我个人理解就是阶梯式向前。vue是轻量级的，它有很多独立的功能或库，我们会根据我们的项目来选用vue的一些功能。就像我们开发项目时如果只用到vue的声明式渲染，我就只用vue的声明渲染，而我们要用他的组件系统，我们可以引用它的组件系统。
官网：https://cn.vuejs.org/
Vue作者：尤雨溪/中国无锡
vue的渐进式表现为：
声明式渲染——组件系统——客户端路由——-大数据状态管理——-构建工具
库，本质上是一些函数的集合。每次调用函数，实现一个特定的功能，接着把
控制权交给使用者
框架，是一套完整的解决方案，使用框架的时候，需要把你的代码放到框架合适的地方，框架会在合适的时机调用你的代码
核心点：谁起到主导作用（控制反转）
框架与库之间最本质区别在于控制权：you call libs, frameworks call you（控制反转）
MVVM通过数据双向绑定让数据自动地双向同步
虽然没有完全遵循 MVVM 模型，Vue 的设计无疑受到了它的启发。因此在文档中经常会使用 vm (ViewModel 的简称) 这个变量名表示 Vue 实例
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script><!-- 生产环境版本，优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>开发环境版本：https://cn.vuejs.org/js/vue.js
生产环境版本：https://cn.vuejs.org/js/vue.min.js
Ctrl+S保存下载即可
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="ja/vue.js"></script><!-- 生产环境版本，优化了尺寸和速度 -->
<script src="js/vue.min.js"></script>| v-text | 更新元素的 tex |
| v-html | 更新元素的 inn |
| v-if | 如果为 true, 当前标签才会输出 |
| v-else | 如果为 false, 当前标签才会输出到页面 |
| v-show | 通过控制 display 样式来控制 |
| v-for | 遍历数组/对象 |
| v-on | 绑定事件监听, 一般简写为@ |
| v-bind | 绑定解析表达式, 可以省略 v-bin |
| v-model | 双向数据绑定 |
| v-cloak | 防止闪现, 与 css 配合: [v-cloak] { display: |
开发工具：HBuilderX
这里使用的是BootCDN中2.6.0版本的vue.js
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!-- 方式一 手动方式 -->
<!-- <script src="vue.js" type="text/javascript"></script> -->
<!-- 方式二 CDN -->
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script>
</head>
<body>
<h1>{{title}}</h1>
<!--
指定vue管理内容区域，通常我们也把它叫做边界，
这意味着我们接下来的改动全部在指定的div内，div外部不受影响
-->
<div id="zhq">
<h1>{{title}}--{{ts}}</h1>
</div>
</body>
<script>
// 每个Vue应用都是通过用Vue构造器创建一个新的Vue实例开始的
var vm=new Vue({
// DOM 元素，挂载视图模型，
el:'#zhq',
// 定义属性，并设置初始值
//方式一
/* data:{
title:'Hello Vue!!!!',
ts:new Date().getTime()
}, */
//方式二:函数方式 注：data在组件开发中的写法必须是一个函数
data:function(){
return{
title:'Hello Vue!!!!',
ts:new Date().getTime()
}
},
// 定义方法，用于事件交互时使用的函数
methods:{
}
})
</script>
</html>
页面：
为什么第一个{{title}}没有显示Hello Vue!!!!呢？
因为第一个{{title}}没有在'#zhq'的边界内，所以不受影响
给按钮设置一个点击事件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!-- 方式一 手动方式 -->
<!-- <script src="vue.js" type="text/javascript"></script> -->
<!-- 方式二 CDN -->
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script>
</head>
<body>
<h1>{{title}}</h1>
<!--
指定vue管理内容区域，通常我们也把它叫做边界，
这意味着我们接下来的改动全部在指定的div内，div外部不受影响
-->
<div id="zhq">
<h1>{{title}}--{{ts}}</h1>
<!--
1) javascript:
window.addListener
<button onclick="return confirm('确定删除吗？')">按钮</button>
2) jquery:
$('选择器').bind('click',function(){})
$('选择器').onclick(function(){})
-->
<button v-on:click="doClick(1)">有种点我</button>
</div>
</body>
<script>
// 每个Vue应用都是通过用Vue构造器创建一个新的Vue实例开始的
var vm=new Vue({
// DOM 元素，挂载视图模型，
el:'#zhq',
// 定义属性，并设置初始值
//方式一
/* data:{
title:'Hello Vue!!!!',
ts:new Date().getTime()
}, */
//方式二:函数方式 注：data在组件开发中的写法必须是一个函数
data:function(){
return{
title:'Hello Vue!!!!',
ts:new Date().getTime()
}
},
// 定义方法，用于事件交互时使用的函数
methods:{
doClick:function(num){
alert('Hello Vue'+num)
}
}
})
</script>
</html>
页面：
注：
- data在组件开发中的写法必须是一个函数
- vue指令：指的是是带有“v-”前缀的特殊属性
- 像用v-on:click指令绑定单击事件
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script>
</head>
<body>
<div id="zhq">
<h1>{{ts}}</h1>
<!-- 案例一：数据的改变会引起DOM的改变，DOM的改变也会引起数据的变化 -->
<input type="text" v-model="num"/>
<button v-on:click="doKeyup()">提交</button><br/>
</div>
</body>
<script>
var vm=new Vue({
el:'#zhq', // DOM 元素，挂载视图模型，
data:function(){
return{
ts:new Date().getTime(),
num:10,
}
},
methods:{ // 定义方法，用于事件交互时使用的函数
doKeyup:function(){
console.log(this.num);
}
}
});
</script>
</html>显示：
点击提交后后台输出的num值也发生了改变
- num初始值----》10
- num点击提交后的值----》101
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script>
</head>
<body>
<div id="zhq">
<h1>{{ts}}</h1>
<!-- 案例一：数据的改变会引起DOM的改变，DOM的改变也会引起数据的变化 -->
<input type="text" v-model="num"/>
<button v-on:click="doKeyup()">提交</button><br/>
<!-- 案例二：只有当实例被创建时data中存在的属性才是响应式的 -->
{{name}}<br/>
</div>
</body>
<script>
var vm=new Vue({
el:'#zhq', // DOM 元素，挂载视图模型，
data:function(){
return{
ts:new Date().getTime(),
num:10,
}
},
methods:{ // 定义方法，用于事件交互时使用的函数
doKeyup:function(){
console.log(this.num);
}
}
});
<!-- 案例二：只有当实例被创建时data中存在的属性才是响应式的 -->
vm.name="zs";
</script>
</html>显示：
可以看到name没有在data中定义，所以{{name}}是没有值的
在data中定义一个name:
data:function(){
return{
ts:new Date().getTime(),
num:10,
name:'ls'
}
},再来看看页面：
zs就显示出来了，页面也没报错
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script>
</head>
<body>
<div id="zhq">
<h1>{{ts}}</h1>
<!-- 案例一：数据的改变会引起DOM的改变，DOM的改变也会引起数据的变化 -->
<input type="text" v-model="num"/>
<button v-on:click="doKeyup()">提交</button><br/>
<!-- 案例二：只有当实例被创建时data中存在的属性才是响应式的 -->
{{name}}<br/>
<!-- 案例三：用v-model指令在表单控件元素上创建双向数据绑定-->
<input type="text" v-model="num" />
<button v-on:click="doIncrement()">++</button><br/>
</div>
</body>
<script>
var vm=new Vue({
el:'#zhq', // DOM 元素，挂载视图模型，
data:function(){
return{
ts:new Date().getTime(),
num:10,
name:'ls'
}
},
methods:{ // 定义方法，用于事件交互时使用的函数
doKeyup:function(){
console.log(this.num);
},
doIncrement:function(){
this.num=this.num+1;
console.log(this.num);
}
}
});
vm.name="zs";
</script>
</html>页面：
点击++之后前面文本框也跟着改变，但是给它手动赋值之后再点++就会出现拼接的效果
很简单，把数据强转成int就行
doIncrement:function(){
this.num=parseInt(this.num)+1;
console.log(vm.num);
} 
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script>
</head>
<body>
<div id="zhq">
<h1>{{ts}}</h1>
<!-- 案例一：数据的改变会引起DOM的改变，DOM的改变也会引起数据的变化 -->
<input type="text" v-model="num"/>
<button v-on:click="doKeyup()">提交</button><br/>
<!-- 案例二：只有当实例被创建时data中存在的属性才是响应式的 -->
{{name}}<br/>
<!-- 案例三：用v-model指令在表单控件元素上创建双向数据绑定-->
<input type="text" v-model="num" />
<button v-on:click="doIncrement()">++</button><br/>
</div>
</body>
<script>
var vm=new Vue({
el:'#zhq', // DOM 元素，挂载视图模型，
data:function(){
return{
ts:new Date().getTime(),
num:10,
name:'ls'
}
},
methods:{ // 定义方法，用于事件交互时使用的函数
doKeyup:function(){
console.log(this.num);
},
doIncrement:function(){
this.num=parseInt(this.num)+1;
<!-- 案例五：局部访问与全局访问 -->
/* console.log(this.num); */
console.log(vm.num);
}
}
});
vm.name="zs";
</script>
</html>页面：
可以看到使用vm.num也可以输出
- vm.name/vm.$data.name(外部访问)
- this.name(内部访问)
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.js"></script>
</head>
<body>
<div id="zhq">
<h1>{{ts}}</h1>
<!-- 案例一：数据的改变会引起DOM的改变，DOM的改变也会引起数据的变化 -->
<input type="text" v-model="num"/>
<button v-on:click="doKeyup()">提交</button><br/>
<!-- 案例二：只有当实例被创建时data中存在的属性才是响应式的 -->
{{name}}<br/>
<!-- 案例三：用v-model指令在表单控件元素上创建双向数据绑定-->
<input type="text" v-model="num" />
<button v-on:click="doIncrement()">++</button><br/>
<!-- 案例四：用v-once指令进行单向绑定，一般不用-->
<span v-once>{{num}}</span>
</div>
</body>
<script>
var vm=new Vue({
el:'#zhq', // DOM 元素，挂载视图模型，
data:function(){
return{
ts:new Date().getTime(),
num:10,
name:'ls'
}
},
methods:{ // 定义方法，用于事件交互时使用的函数
doKeyup:function(){
console.log(this.num);
},
doIncrement:function(){
this.num=parseInt(this.num)+1;
<!-- 案例五：局部访问与全局访问 -->
/* console.log(this.num); */
console.log(vm.num);
}
}
});
vm.name="zs";
</script>
</html>
页面：
可以看出加了v-once的<span>标签没有变依然是初始值
注1：console对象可以使用printf风格的占位符。只支持字符（%s）、整数（%d或%i）、浮点数（%f）和对象（%o）四种
doIncrement:function(){
this.num=parseInt(this.num)+1;
<!-- 案例五：局部访问与全局访问 -->
/* console.log(this.num); */
console.log(vm.num);
<!-- console对象可以使用printf风格的占位符 -->
console.log("num=%d,name=%s",this.num,this.name);
}
注2：Vue实例还暴露了一些有用的实例属性与方法。它们都有前缀$，以便与用户定义的属性区分开来
生命周期钩子函数的定义：从组件被创建，到组件挂载到页面上运行，再到页面关闭组件被卸载，这三个阶段总是伴随着组件各种各样的事件，这些事件，统称为组件的生命周期函数！
生命周期钩子函数，我们只需要提供这些钩子函数即可
?博客主页：https://xiaoy.blog.csdn.net?本文由呆呆敲代码的小Y原创，首发于CSDN??学习专栏推荐：Unity系统学习专栏?游戏制作专栏推荐：游戏制作?Unity实战100例专栏推荐：Unity实战100例教程?欢迎点赞?收藏⭐留言?如有错误敬请指正！?未来很长，值得我们全力奔赴更美好的生活✨------------------❤️分割线❤️-------------------------
目录前言滤波电路科普主要分类实际情况单位的概念常用评价参数函数型滤波器简单分析滤波电路构成低通滤波器RC低通滤波器RL低通滤波器高通滤波器RC高通滤波器RL高通滤波器部分摘自《LC滤波器设计与制作》，侵权删。前言最近需要学习放大电路和滤波电路，但是由于只在之前做音乐频谱分析仪的时候简单了解过一点点运放，所以也是相当从零开始学习了。滤波电路科普主要分类滤波器：主要是从不同频率的成分中提取出特定频率的信号。有源滤波器：由RC元件与运算放大器组成的滤波器。可滤除某一次或多次谐波，最普通易于采用的无源滤波器结构是将电感与电容串联，可对主要次谐波（3、5、7）构成低阻抗旁路。无源滤波器：无源滤波器，又称
项目介绍随着我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱小学生兴趣延时班预约小程序的设计与开发被用户普遍使用,为方便用户能够可以随时进行小学生兴趣延时班预约小程序的设计与开发的数据信息管理,特开发了小程序的设计与开发的管理系统。小学生兴趣延时班预约小程序的设计与开发的开发利用现有的成熟技术参考,以源代码为模板,分析功能调整与小学生兴趣延时班预约小程序的设计与开发的实际需求相结合,讨论了小学生兴趣延时班预约小程序的设计与开发的使用。开发环境开发说明：前端使用微信微信小程序开发工具：后端使用ssm：VU
@作者:SYFStrive @博客首页:HomePage📜：微信小程序📌：个人社区（欢迎大佬们加入）👉：社区链接🔗📌：觉得文章不错可以点点关注👉：专栏连接🔗💃：感谢支持,学累了可以先看小段由小胖给大家带来的街舞👉微信小程序（🔥）目录自定义组件-behaviors 1、什么是behaviors 2、behaviors的工作方式 3、创建behavior 4、导入并使用behavior 5、behavior中所有可用的节点 6、同名字段的覆盖和组合规则总结最后自定义组件-behaviors 1、什么是behaviorsbehaviors是小程序中，用于实现
遍历文件夹我们通常是使用递归进行操作，这种方式比较简单，也比较容易理解。本文为大家介绍另一种不使用递归的方式，由于没有使用递归，只用到了循环和集合，所以效率更高一些！一、使用递归遍历文件夹整体思路1、使用File封装初始目录，2、打印这个目录3、获取这个目录下所有的子文件和子目录的数组。4、遍历这个数组，取出每个File对象4-1、如果File是否是一个文件，打印4-2、否则就是一个目录，递归调用代码实现publicclassSearchFile{publicstaticvoidmain(String[]args){//初始目录Filedir=newFile("d:/Dev");Datebeg
ES一、简介1、ElasticStackES技术栈：ElasticSearch：存数据+搜索；QL；Kibana：Web可视化平台，分析。LogStash：日志收集，Log4j:产生日志；log.info(xxx)。。。。使用场景：metrics：指标监控…2、基本概念Index（索引）动词：保存（插入）名词：类似MySQL数据库，给数据Type（类型）已废弃，以前类似MySQL的表现在用索引对数据分类Document（文档）真正要保存的一个JSON数据{name:"tcx"}二、入门实战{"name":"DESKTOP-1TSVGKG","cluster_name":"elasticsear
文章目录1.任务背景2.任务目标3.相关知识点4.任务实操4.1安装配置JDK4.2启动FISCOBCOS4.3下载解压WeBASE-Front4.4拷贝sdk证书文件4.5启动节点4.6访问节点4.7检查运行状态5.任务总结1.任务背景FISCOBCOS其实是有控制台管理工具，用来对区块链系统进行各种管理操作。但是对于初学者来说，还是可视化界面更友好，本节就来介绍WeBASE管理平台，这是一款微众银行开源的自研区块链中间件平台，可以降低区块链使用的门槛，大幅提高区块链应用的开发效率。微众银行是腾讯牵头设立的民营银行，在国内民营银行里还是比较出名的。微众银行参与FISCOBCOS生态建设，一定
参考文章搭建文章gitte源码在线体验可以注册两个号来测试演示图：一.整体介绍 介绍SignalR一种通讯模型Hub(中心模型，或者叫集线器模型)，调用这个模型写好的方法，去发送消息。 内容有： ①：Hub模型的方法介绍 ②：服务器端代码介绍 ③：前端vue3安装并调用后端方法 ④：聊天室样例整体流程：1、进入网站->调用连接SignalR的方法2、与好友发送消息->调用SignalR的自定义方法 前端通过，signalR内置方法.invoke() 去请求接口3、监听接受方法（渲染消息）通过new signalR.HubConnectionBuilder().on
TCL脚本语言简介•TCL（ToolCommandLanguage）是一种解释执行的脚本语言（ScriptingLanguage）,它提供了通用的编程能力：支持变量、过程和控制结构；同时TCL还拥有一个功能强大的固有的核心命令集。TCL经常被用于快速原型开发，脚本编程，GUI和测试等方面。•实际上包含了两个部分：一个语言和一个库。首先，Tcl是一种简单的脚本语言，主要使用于发布命令给一些互交程序如文本编辑器、调试器和shell。由于TCL的解释器是用C\C++语言的过程库实现的，因此在某种意义上我们又可以把TCL看作C库，这个库中有丰富的用于扩展TCL命令的C\C++过程和函数，所以，Tcl是
文章目录一、项目场景二、基本模块原理与调试方法分析——信源部分：三、信号处理部分和显示部分：四、基本的通信链路搭建：四、特殊模块：interpretedMATLABfunction：五、总结和坑点提醒一、项目场景 最近一个任务是使用simulink搭建一个MIMO串扰消除的链路，并用实际收到的数据进行测试，在搭建的过程中也遇到了不少的问题（当然这比vivado里面的debug好不知道多少倍）。准备趁着这个机会，先以一个很基本的通信链路对simulink基础和相关的debug方法进行总结。 在本篇中，主要记录simulink的基本原理和基本的SISO通信传输链路（QPSK方式），计划在下篇记