Vue
X ゜
今天的砖还是格外的烫手,对面超市的冰镇百威还是我不敢奢求的梦。
展开
-
Vue项目搭建与部署
1.1介绍Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue两大核心思想:组件化和数据驱动。组件化就是将一个整体合理拆分为一个一个小块(组件),组件可重复使用;数据驱动是前端的未来发展方向,释放了对DOM的操作,让DOM随着数据的变化自然而然的变化(尤神原话),不必过多的关注DOM,只需要将数据组织好即可。1.随意创建一个文件夹2.创建名为springboot-vue-demo的工程vue create springboot-vue-原创 2021-07-25 19:17:46 · 223 阅读 · 0 评论 -
Vue组件模板--深入浅出
组件模板如果仅仅具备前面的知识,那你的前端开发与Jquery、甚至原生Javascript形式的开发别无二样,Vue真正的强大之处在于,它不仅彻底实现了网页组件的模块化,还提供了大量实用且美观的模块基础组件W3C命名规范:字母全小写,包含连字符核心语法// 组件定义(组件应定义在脚本内容的前方)- 参数1:组件名 参数2:组件逻辑 Vue.component('cmp-a', { // 组件名:cmp-a props: [{},], // 组件属性原创 2020-08-14 19:56:55 · 366 阅读 · 0 评论 -
Vue实现异步通讯
实现原理**Vue是面向视图层的开发框架,本身并不具备异步通讯的能力,不过它提供了整合Axios框架的良好接口:钩子函数。钩子函数是Vue对象生命周期中的阶段性回调函数基础程序1.导入Vue和Axios类库Ajax请求:编写钩子函数 - 加载页面时进行请求// 1、编写钩子函数:mounted()mounted() { // AJAX通讯: axios.get('xxx.json') // response.data接收返回的Json字符串,再赋值给this.info原创 2020-08-14 18:23:55 · 453 阅读 · 0 评论 -
Axios-深入浅出
Axios请求函数会截断其身后的代码,使之不再执行!!!!axios.request(config)axios.get(url[, config])axios.delete(url[, config])axios.head(url[, config])axios.options(url[, config])axios.post(url[, data[, config]])axios.put(url[, data[, config]])axios.patch(url[, data[, conf原创 2020-08-14 18:17:12 · 244 阅读 · 0 评论 -
Vuex 使用总结(详细解答)
dispatch:含有异步操作,数据提交至 actions ,可用于向后台提交数据写法示例: this.$store.dispatch(‘isLogin’, true);commit:同步操作,数据提交至 mutations ,更新全局变量写法示例: this.$store.commit(‘loginStatus’, 1);传统方式:层级越多,代码越繁杂数据传递:ShopCarContainer.vue → ShopcarNumbox.Vue实现方式:子组件定义属性,然后父模块通过属性原创 2020-08-14 18:10:16 · 192 阅读 · 0 评论 -
Vue.js基础语法-新手入门教程
1、变量引用变量在网页中的引用是声明式的、动态的,就算编译解析阶段变量不存在也不会影响网页美观、更不会报错(因为引用只是被当作声明),而只要运行期间发现网页引用是确有变量、确有其值,就会实时对网页进行更新!(底层原理是事件监听)<script> let vue = new Vue({ el:'#demo', data: { message: "aaa" } });</scr原创 2020-08-14 17:45:13 · 298 阅读 · 0 评论 -
vue ui可视化界面进行创建vue项目安装
1.安装(使用的淘宝镜像)需要安装node.js,vue-cli可以在我的主页VUE专栏里找到cnpm install -g @vue/cli2.安装完成后vue ui网页弹出可视化界面选好路径创建,不保存预设,然后创建出成功的界面点击运行,输出可以进入代表创建成功用IDEA导入,下一步进行JavaScript需要设置为6如果你的vue不显示绿色V图标,需要把vue插件加上运行命令cnpm run serve...原创 2020-07-11 17:54:18 · 6858 阅读 · 1 评论 -
Vue-Router深入浅出
钩子导航被触发。在失活的组件里调用离开路由函数。调用全局的 beforeEach 路由函数。在重用的组件里调用 beforeRouteUpdate 路由函数 (2.2+)。在路由配置里调用 beforeEnter。解析异步路由组件。在被激活的组件里调用 beforeRouteEnter。调用全局的 beforeResolve 路由函数 (2.5+)。导航被确认。调用全局的 afterEach 钩子。触发 DOM 更新。用创建好的实例调用 beforeRouteEnter 路由函数中原创 2020-06-29 22:06:50 · 1959 阅读 · 0 评论 -
深入webpack(Vue教学)
全局安装webpack(在cmd中类似安装vue-cli)vue-cli脚手架安装# 安装cnpm install webpack -gcnpm install webpack-cli -g# 测试webpack -vwebpack-cli -v新建一个目录结构hello.js// 暴露一个方法exports.sayHi1 = function(){ document.write("<h1>Hello, World--------1!</h1>")原创 2020-06-25 15:48:08 · 1266 阅读 · 0 评论 -
npm run server报错(完美解决):A complete log of this run can be found in:
npm run dev 出现错误的,这不是你的错,版本升级了vue在IDEA中安装完美过程以前这里是dev,官方升级后变为serve,所以你需要把dev 代为serve,就可以运行了原创 2020-06-23 22:58:37 · 4002 阅读 · 0 评论 -
Vue-cli(vue脚手架)详细安装教程-淘宝镜像加速器-IDEA版本
1.确保电脑中存在的node.js(安装步骤如下)网址:http://nodejs.cn/2.检查电脑中是否有node.js环境(如下图)3.其次需要全局安装,淘宝镜像加速器 输入以下命令 npm install cnpm -g4.安装vue-cli(到现在vue脚手架就算完成) cnpm install vue-cli -g5.创建一个vue程序,以管理员身份打开命令提示符,进入到你准备创建程序的位置,(例如我要放在d盘的 IDEA SAVES下)6.输入命令vu原创 2020-06-21 18:21:13 · 6464 阅读 · 2 评论 -
Vue基础教程(白痴教程)
MVVM模式下图不仅概括了MVVM模式(Model-View-ViewModel),还描述了在Vue.js中ViewModel是如何和View以及Model进行交互的。ViewModel是Vue.js的核心,它是一个Vue实例。Vue实例是作用于某一个HTML元素上的,这个元素可以是HTML的body元素,也可以是指定了id的某个元素。当创建了ViewModel后,双向绑定是如何达成的呢?首先,我们将上图中的DOM Listeners和Data Bindings看作两个工具,它们是实现双向绑定的关原创 2020-06-20 19:06:22 · 7237 阅读 · 1 评论