整体页面代码：

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>添加品牌</title>

</head>

<body>

<div id="app">

<h3>添加品牌</h3>

<form action="" method="post">

品牌名称：<input id="brandName" v-model="brand.brandName" name="brandName"><br>

企业名称：<input id="companyName" v-model="brand.companyName" name="companyName"><br>

排序：<input id="ordered" v-model="brand.ordered" name="ordered"><br>

描述信息：<textarea rows="5" cols="20" id="description" v-model="brand.description"

name="description"></textarea><br>

状态：

<input type="radio" name="status" v-model="brand.status" value="0">禁用

<input type="radio" name="status" v-model="brand.status" value="1">启用<br>

<input type="button" id="btn" @click="submitForm" value="提交">

</form>

</div>

<script src="js/axios-0.18.0.js"></script>

<script src="js/vue.js"></script>

<script>

new Vue({

el: "#app",

data(){

return {

brand:{}

}

},

methods:{

submitForm(){

// 发送ajax请求，添加

var _this = this;

axios({

method:"post",

url:"http://localhost:8080/brand-demo/addServlet",

data:_this.brand

}).then(function (resp) {

// 判断响应数据是否为 success

if(resp.data == "success"){

location.href = "http://localhost:8080/brand-demo/brand.html";

}

})

}

}

})

</script>

</body>

</html>

Vue学习笔记-生命周期的更多相关文章

  1. vue学习之生命周期和钩子函数

    参考文章:Vue2.0 探索之路——生命周期和钩子函数的一些理解 抛出问题: 我们有时候会在几个钩子函数里做一些事情,那么什么时候做,该在哪个函数里做? 生命周期简介 结合代码看el 和 data以及 ...

  2. vue学习之五生命周期

    一.vue生命周期图解 下图展示了实例的生命周期.你不需要立马弄明白所有的东西,不过随着你的不断学习和使用,它的参考价值会越来越高. 二.vue钩子函数使用 2.1beforeCreate 在实例初始 ...

  3. vue学习三:生命周期钩子

    生命周期钩子介绍: 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等.同时在这个过程中也会运行一些叫做生 ...

  4. Vue学习之生命周期钩子小结（四）

    一.生命周期钩子(函数): 1.每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等.同时在这个过程中也会运 ...

  5. vue笔记 - 生命周期第二次学习与理解

    对于刚接触vue一两个月.才仅仅独立做过一两个vue项目的小白来说,以前一直自我感觉自己知道vue的生命周期, 直到前两天去面试,面试官让我说一下vue的生命周期... 其实我的心中是有那张图的,但是 ...

  6. vue学习笔记（二） ---- vue实例的生命周期

    vue实例的生命周期 什么是生命周期:从Vue实例创建.运行.到销毁期间,总是伴随着各种各样的事件,这些事件,统称为生命周期! 生命周期钩子:就是生命周期事件的别名而已: 生命周期钩子 = 生命周期函 ...

  7. vue学习笔记：Vue生命周期

    概念 一个Vue 实例从开始创建.初始化数据.编译模板.挂载 DOM.渲染→更新→渲染.卸载等一系列过程,这就是 Vue 的生命周期.同时在这个过程中也会运行一些叫做生命周期钩子的函数,这给了用户在不 ...

  8. Vue学习笔记-2

    前言 本文非vue教程,仅为学习vue过程中的个人理解与笔记,有说的不正确的地方欢迎指正讨论 1.computed计算属性函数中不能使用vm变量 在计算属性的函数中,不能使用Vue构造函数返回的vm变 ...

  9. vue 学习笔记（二）

    最近公司赶项目,一直也没时间看 vue,之前看下的都快忘得差不多了.哈哈哈,来一起回顾一下vue 学习笔记(一)后,继续向下看嘛. #表单输入绑定 基础用法 v-model 会忽略所有表单元素的 va ...

  10. python 全栈开发，Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)

    昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...

随机推荐

  1. 在deepin上使用Fleet开发SpringBoot 3.0.0项目

    前言 Fleet被称为是由 JetBrains 打造的下一代 IDE,目前出于公测状态,可以免费下载使用. SpringBoot 3.0.0最小支持是JDK 17,这或许是对于JDK8的断舍离迈出的重 ...

  2. Docker CE

    3. 安装Docker CE Docker有两个分支版本:Docker CE和Docker EE,即社区版和企业版.本教程基于CentOS 7安装Docker CE. 执行如下命令,安装Docker的 ...

  3. 嵌入式BI的精解与探索

    摘要:本文由葡萄城技术团队原创并首发.转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 前言 1996年,商业智能(BI)的概念首次浮现,随后的20多年间,商 ...

  4. JDK、JRE、JVM三者介绍

    概念 JDK: Java Development Kit,java开发者工具. JRE: Java Runtime Enviroment,java运行时环境. JVM: Java Virtual Ma ...

  5. 文心一言 VS 讯飞星火 VS chatgpt （114）-- 算法导论10.2 7题

    七.用go语言,给出一个 O(n)时间的非递归过程,实现对一个含 n个元素的单链表的逆转.要求除存储链表本身所需的空间外,该过程只能使用固定大小的存储空间. 文心一言: 在Go语言中,你可以使用迭代方 ...

  6. Kubernetes:kube-apiserver 之 scheme（二）

    接 Kubernetes:kube-apiserver 之 scheme(一). 2.2 资源 convert 上篇说到资源版本之间通过内部版本 __internal 进行资源转换.这里进一步扩展介绍 ...

  7. 详解GuassDB数据库权限命令：GRANT和REVOKE

    本文分享自华为云社区<GuassDB数据库的GRANT & REVOKE>,作者: Gauss松鼠会小助手2 . 一.GaussDB的权限概述 在数据库中,对象的创建者将成为该对象 ...

  8. 10.7 多校联测 Day? 总结

    打了一场从头到尾稀里糊涂的比赛. 脑子完全不转. 开考看 T1,一开始连逆序对都没看出来.想着把不合法的点两两连边黑白染色(也是够离谱)然后也不知道干了啥(似乎很困),反正一个小时过去了. 就只看出来 ...

  9. Linux运维技能图谱

    前言 该技能图谱依个人经验绘制,不适用于所有运维岗位.对于刚入行的从业者,也不需要按照图谱全学一遍,应该根据岗位工作内容来学习.有些技术我也不会,但作为一个选项我也写进去了,比如容器运行时有Docke ...

  10. Langchain-Chatchat项目：4.2-P-Tuning v2使用的数据集

      本文主要介绍P-tuning-v2论文中的5种任务,分别为Glue任务.NER任务.QA任务.SRL任务.SuperGlue任务,重点介绍了下每种任务使用的数据集. 一.Glue任务   GLUE ...