vue模式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="./vuev2.5.21.js"></script>
</head>
<body>
<div id="app">
<input type="text" v-model="inputValue">
<button v-on:click="BtnClick">提交</button>
<ul>
<li v-for="item in list">{{item}}</li>
</ul>
</div>
<script>
var app= new Vue({
el:"#app",
data:{
list:["嗷嗷嗷"],
inputValue:""
},
methods:{
BtnClick:function(){
// console.log(this.list);
this.list.push(this.inputValue);
this.inputValue="";
}
}
})
</script> </body>
</html>
vue模式的更多相关文章
- python工业互联网应用实战18—前后端分离模式之jquery vs vue
前面我们分三章来说明了使用django template与jquery的差别,通过jquery如何来实现前后端的分离,同时再9章节使用vue.js 我们浅尝辄止的介绍了JQuery到vue的切换,由于 ...
- Vue+Express实现前后端分离
先说明一下缘由,因为自己前段时间在实习,实习期间为了参与项目开发,粗略学习了下Vue.Vuex.Vue-Router,大致会一些基础的.这里也快要做毕业设计了,趁着放假回来的这两天,学习下Node的相 ...
- vue框架学习笔记(vue入门篇)
vue框架 - 构建用户界面的渐进式框架 - 采用自底层向上增量开发的设计 - 核心库只关注视图层 - 当与单文件组件和vue生态系统支持的库结合使用时,也完全能够为复杂的单页应用程序提供驱动 - v ...
- vue面试常遇到的面试题
最近面试了好几家公司,总结一下经常被问到的面试题. 首先呢,一开始先来一个自我介绍,没啥好说的. 接下来就是考验你vue技术的问题了 一些常见的面试题 vue的生命周期 一共有八个阶段,分别为创建前后 ...
- 移动端跨平台方案对比:React Native、weex、Flutter
跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架百花齐放,颇有一股推倒原生开发者的势头. 为什么我们需 ...
- 最火移动端跨平台方案盘点:React Native、weex、Flutter
1.前言 跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架的百花齐放,颇有一股推倒原生开发者的势头. ...
- megalo -- 网易考拉小程序解决方案
megalo 是基于 Vue 的小程序框架(没错,又是基于 Vue 的小程序框架),但是它不仅仅支持微信小程序,还支持支付宝小程序,同时还支持在开发时使用更多 Vue 的特性. 背景 对于用户而言,小 ...
- 谷歌浏览器安装vuejs devtools 插件
1 . 下载chrome扩展插件. 在github上下载压缩包并解压到本地,github下载地址:https://github.com/vuejs/vue-devtools 2. npm instal ...
- EIP权限工作流平台总结-2前端框架
1.预览地址:www.eipflow.com (1) 权限工作流:www.demo.eipflow.com/Account/Login (2) 基础权限版:www.auth.eipflow.com ...
随机推荐
- 编辑输出“Hello World”
一.新建java项目 执行“文件->新建->项目建立”,打开建立新项目对话框,在编辑框中输入项目名,其他选项为默认值,随后点击“完成”按钮. 二.新建java类 执行“文件->新建- ...
- DataTable行分组,并sum求和
两种方式: 第一种,Linq void Main() { var dt=new DataTable(); dt.Columns.Add("medicID"); dt.Columns ...
- linux 网络虚拟化: network namespace 简介
linux 网络虚拟化: network namespace 简介 network namespace 是实现网络虚拟化的重要功能,它能创建多个隔离的网络空间,它们有独自的网络栈信息.不管是虚拟机还是 ...
- bootstrap-table 踩坑手记
官方文档: http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/ 渲染表格有两种方法: 1)data属性渲染表格 2)js代码渲染表 ...
- Python_格式化字符
%% 百分号标记 #就是输出一个%%c 字符及其ASCII码%s 字符串 %r 是不管是什么打印出来%d 有符号整数(十进制)%u 无符号整数(十进制)%o 无符号整数(八进制)%x 无符号整数(十六 ...
- Google资深工程师深度讲解Go语言完整教程
资源获取链接点击这里 欢迎大家来到深度讲解Go语言的课堂.本课程将从基本语法讲起,逐渐深入,帮助同学深度理解Go语言面向接口,函数式编程,错误处理,测试,并行计算等元素,并带领大家实现一个分布式爬虫的 ...
- 实际操作--create DB link
我可以查看6D1数据库中的表了:我在哪个表里创建database说明我想访问database中的表~ SELECT * FROM TEST001MX@TESTLINK1 databa ...
- POJ 2368 Buttons
题目链接:http://poj.org/problem?id=2368 Bash game (巴什博弈):当K是(L+1)的倍数时可以确保second player赢.所以这道题要找的就是在K的因子中 ...
- Java中子类对象初始化的过程
Java中的继承机制看似简单,实际上包含了很多细节.最近在刷题过程中屡屡跳坑,于是自己仔细再学习了一下Java中子类初始化的细节,与大家分享. class Father { Father(){}; } ...
- vue中使用axios
1.结合vue-axios使用 vue-axios是按照vue插件的方式去写的,那么结合vue-axios就可以使用Vue.use()这个方法import axios from 'axios' imp ...