Vue 基础学习
关注
分享
扫一扫
Vue 基础学习
heaven_dad
不曾与你分享的时间，我在进步
展开
-
11. Vue Axios异步通信
11. Vue Axios异步通信 什么是axios? Axios是一个开源的可以在浏览器端和Node.js的异步通信框架，主要功能是实现AjAx的异步通信。 他不属于vue里面的，而是经常与vue一起使用实现ajax异步通信 安装 使用 npm: $ npm install axios 使用 bower: $ bower install axios 使用 cdn: <script src="https://unpkg.com/axios/dist/axios.min.js"></scr原创 2020-07-29 20:49:19 · 212 阅读 · 0 评论 -
10. Vue 路由
10. Vue 路由 需要引入 vue-router.js 而且放在vue.js下面 代码实现 <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <script src="vue-router.min.js"></script> <div id="app"> &l原创 2020-07-29 20:48:18 · 143 阅读 · 0 评论 -
9. Vue 生命周期
9. Vue 生命周期 -Vue生命周期主要记住两个方法 created 和 mounted方法 created在页面渲染之前执行 mounted在页面渲染之后执行 debugger相当于打断点 代码实现 <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <div id="app">原创 2020-07-29 20:47:25 · 162 阅读 · 0 评论 -
8. Vue 组件化应用构建
8. Vue 组件化应用构建 组件是Vue.js最强大的功能之一 组件可以扩展html元素，封装可重用代码 局部组件 代码实现 (用法就是标签引用组件) <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <div id="app"> <xuan></xuan>原创 2020-07-29 20:46:40 · 207 阅读 · 0 评论 -
7. Vue的vue-if和vue-for标签
7. Vue的vue-if和vue-for标签 官网例子： https://cn.vuejs.org/v2/guide/conditional.html v-if 条件判断 代码展示 <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <div id="app"> <input type="原创 2020-07-29 20:44:16 · 826 阅读 · 0 评论 -
6. Vue 修饰符
6. Vue 修饰符 可用于阻止表单提交 <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <div id="app"> <!--修饰符用于指出一个指令应该以特殊方式绑定。 这里的.prevent修饰符告诉 v-on指令对于触发的事件调用js的 event.preventDefault()原创 2020-07-29 20:42:33 · 130 阅读 · 0 评论 -
5. Vue 事件绑定
5. Vue 事件绑定 代码演示1 @click单击事件 <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <div id="app"> <!-- 通过按钮实现事件的绑定 --> <button v-on:click="search()">查询结果<原创 2020-07-29 20:40:32 · 170 阅读 · 0 评论 -
4. v-model双向绑定
4. v-model双向绑定 代码演示1 双向绑定就是一起发生变化 <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <div id="app"> <input type="text" v-bind:value="user.name"></input> <原创 2020-07-29 20:39:12 · 139 阅读 · 0 评论 -
3. v-bind指令学习（单向绑定）
3. v-bind指令学习（单向绑定） v-bind 单向数据绑定 一般用在标签属性里面，获取值 <body> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> <div id="app"> <!-- v-bind 单向数据绑定 一般用在标签属性里面，获取值 --> <h3 v-bind原创 2020-07-29 20:38:04 · 288 阅读 · 0 评论 -
2. 第一个Vue入门程序
2. 第一个Vue入门程序 第一步：下载vue插件 第二步：创建html 并且引入 <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script> 第三步：编写基础的vue程序 <!--View层 模板--> <div id="app"> <!-- 使用插值表达式取值 --> {{message}} </div> <原创 2020-07-29 20:36:43 · 137 阅读 · 0 评论 -
1.Vue介绍及相关知识描述
1.什么是Vue 是一款渐进式的JavaScript框架，所谓渐进式就是逐步实现新特性的意思。如实现模块化开发、路由、状态管理等新特性。其特点是综合了Angular的模块化特性以及React的虚拟DOM特性。 与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。 HTML+CSS+JS： 视图 ：给用户看，刷新原创 2020-07-29 20:35:27 · 713 阅读 · 0 评论