vue.js
文章平均质量分 67
zfl273
再骄傲的人都会败给时间
展开
-
npm run dev报错node sass does not yet
vue运行的时候报错解决转载 2022-07-27 11:25:08 · 415 阅读 · 0 评论 -
解决vue组件化高,逻辑密集时的路由控制
背景:项目是接手其他人的项目,在组件化非常密集的项目,并且逻辑都集中在这些组件里,问题的关键在于并没有使用好路由来控制导航,而项目全是控制组件的显示,隐藏,所有的逻辑都发生在这一个url里,这个项目是h5嵌套到了原生APP里,话说原生可以通过桥接的方法给h5提供方法,但是原生端不是我们公司,正式大名鼎鼎的华为,人家才不会给你提供呢,人家还让你隐藏自己有所得返回键,只让他原生端的返回键出现。所以出现了极大问题,就是他的物理返回键非常不匹配我们的组件显示和隐藏!!!,怎么办,怎么办,着急,在线等。。原创 2021-05-26 12:07:19 · 116 阅读 · 0 评论 -
vue中8种组件通信方式
vue是数据驱动视图更新的框架, 所以对于vue来说组件间的数据通信非常重要,那么组件之间如何进行数据通信的呢? 首先我们需要知道在vue中组件之间存在什么样的关系, 才更容易理解他们的通信方式。vue组件中关系说明:如上图所示, A与B、A与C、B与D、C与E组件之间是父子关系; B与C之间是兄弟关系;A与D、A与E之间是隔代关系; D与E是堂兄关系(非直系亲属) 针对以上关系我们归类为: 父子组件之间通信 非父子组件之间通信(兄弟组件、隔代关系组件等) 一、props /.原创 2021-05-06 09:57:42 · 325 阅读 · 0 评论 -
vue watch 深度监听
<div> <p>FullName: {{fullName}}</p> <p>FirstName: <input type="text" v-model="firstName"></p></div>new Vue({ el: '#root', data: { firstName: 'Dawei', lastName: 'Lou', fullName: '...原创 2021-03-03 14:32:04 · 237 阅读 · 1 评论 -
vue单页面
组件嵌套将单文件组件组合在一起有两种方式,一种是嵌套方式,一种用路由的方式。嵌套的方式代码如下:下图示中,假设组件A中要嵌入组件B<template> // 在A组件中使用B组件 <B_zujian></B_zujian></template><script>// 先导入B组件,其中'@'表示src目录,组件后...原创 2018-07-12 13:19:01 · 1006 阅读 · 0 评论 -
vue组件开发
vue组件组件(Component)是Vue.js最强大的功能之一。组件可以扩展 HTML 元素,封装可重用的代码。所有的 Vue 组件同时也都是 Vue 的实例,所以可接受相同的选项对象 (除了一些根级特有的选项) 并提供相同的生命周期钩子。注册及使用组件// 注册一个组件:Vue.component('my-component', { template: '<div>A cu...原创 2018-07-12 13:16:00 · 699 阅读 · 0 评论 -
vue使用
事件处理事件绑定方法可以用 v-on 指令监听 DOM 事件,并在触发时运行一些 JavaScript 代码,事件的处理,简单的逻辑可以写在指令中,复杂的需要在vue对象的methods属性中指定处理函数。<div id="example-1"> <!-- 在指令中写处理逻辑 --> <button v-on:click="counter += 1">A...原创 2018-07-12 13:08:26 · 343 阅读 · 0 评论 -
vue渲染
1.条件渲染通过条件指令可以控制元素的创建(显示)或者销毁(隐藏),常用的条件指令如下:v-ifv-if可以控制元素的创建或者销毁<h1 v-if="ok">Yes</h1>v-elsev-else指令来表示 v-if 的“else 块”,v-else 元素必须紧跟在带 v-if 或者 v-else-if 的元素的后面,否则它将不会被识别。<div v-if="Ma...原创 2018-07-12 13:04:02 · 549 阅读 · 0 评论 -
vue的class和style绑定
Class 与 Style 绑定使用v-bind指令来设置元素的class属性或者sytle属性,它们的属性值可以是表达式,vue.js在这一块做了增强,表达式结果除了是字符串之外,还可以是对象或者数组。Class绑定对象语法可以给v-bind:class传一个对象,以动态的切换class<div class="static" v-bind:class="{active:isActive,'...原创 2018-07-12 13:00:02 · 149 阅读 · 0 评论 -
vue计算属性和侦听属性
计算属性和侦听属性计算属性模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如:<div id="example"> {{ message.split('').reverse().join('') }}</div>这个表达式的功能是将message字符串进行反转,这种带有复杂逻辑的表达式,我们可以使用计算属性...原创 2018-07-12 12:58:15 · 1288 阅读 · 1 评论 -
vue模版语法介绍
Vue.js模板语法模板语法指的是如何将数据放入html中,Vue.js使用了基于 HTML的模板语法,允许开发者声明式地将DOM绑定至底层 Vue 实例的数据。所有 Vue.js的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析。插入值数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值:<span>Message: {{ msg...原创 2018-07-11 20:29:37 · 162 阅读 · 0 评论 -
vue简介
vue.js简介Vue.js读音 /vjuː/, 类似于 viewVue.js是前端三大新框架:Angular.js、React.js、Vue.js之一,Vue.js目前的使用和关注程度在三大框架中稍微胜出,并且它的热度还在递增。Vue.js可以作为一个js库来使用,也可以用它全套的工具来构建系统界面,这些可以根据项目的需要灵活选择,所以说,Vue.js是一套构建用户界面的渐进式框架。Vue的核心...原创 2018-07-11 20:25:52 · 3494 阅读 · 0 评论