一、前言    之前的博客聊过 vue2.0和react的技术选型;聊过vue的axios封装和vuex使用。今天简单聊聊 vue 组件的封装。    vue 的ui框架现在是很多的,但是鉴于移动设备的复杂性,兼容性问题突出。像 Mint-UI 等说实话已经很不错了,但是坑也是不少,而且项目中很多功能仅凭这些也实现不了,这需要我们去封装自
转载 2024-06-13 21:11:29
36阅读
1.0 Vue的方法(methods)methods['meθədz] 方法<div id="app"> {{num}} <!-- `getTime` 是在下面定义的方法名 --> <div>方法:{{getTime()}}</div> <!--控制台输入 vm.addNum()按回车 num和getTime(
关于端口的问题有很多的办法, 默认情况下,Windows有很多端口是开放的,在你上网的时候,网络病毒和黑客可以通过这些端口连上你的电脑。为了让你的系统变为铜墙铁壁,应该封闭这些端口,主要有:TCP 135、139、445、593、1025 端口和 UDP 135、137、138、445 端口,一些流行病毒的后门端口(如 TCP 2745、3127、612
转载 2024-05-01 20:37:36
12阅读
什么是函数式组件组件没有管理任何状态,也没有监听任何传递给它的状态,也没有生命周期方法时,可以将组件标记为functional ,这意味它无状态 (没有响应式数据),也没有实例 (没有 this 上下文)。如何使用src\components\render\heading-functional.vue<script> export default { functional: tru
函数  自定义函数     methods:{    fun:function(){           this.变量          }   &
简介vue是非常流行的框架,他结合了angular和react的优点,从而形成了一个轻量级的易上手的具有双向数据绑定特性的mvvm框架。本人比较喜欢用之。在我们用vue时,我们经常用到一个方法是this.$nextTick,相信你也用过。我常用的场景是在进行获取数据后,需要对新视图进行下一步操作或者其他操作时,发现获取不到dom。因为赋值操作只完成了数据模型的改变并没有完成视图更新。在这个时候我们
Vue.js内部有这样一段代码 其中定义了Vue构造函数,然后分别调用initMiXin,stateMixin,eventsMixin,lifecycleMixin,renderMixin,并将Vue构造函数当作参数传给这5个函数这5个函数的作用就是向Vue的原型上挂载方法。 当函数initMixin被调用时,会向Vue构造函数的prototype属性添加_init方法,执行new Vu
一、Vue中的事件监听vm.$on(event, callback )参数:{ String | Array<String> } event { function } callback监听当前实例上的自定义事件,事件可以由 vm.$emit触发。回调函数会接收所有传入参数触发函数的额外参数实例:$vm.$on('test', function(msg){ alert(
前言在 vue 源码中,封装了很多工具函数,学习这些函数,一方面学习大佬们的实现方式,另一方面是温习基础知识,希望大家在日常工作中,简单的函数也可以自己封装,提高编码能力。本次涉及的工具函数 1-16 在 Vue3 的源码中,路径是 core/packages/shared/src/index.ts。17-22 在 Vue2 的
转载 3月前
74阅读
Vue04-表单数据收集+过滤器+内置指令1.表单数据收集<body> <div id="app"> <!-- 1 <input type="text"/>,v-model收集的是value值,用户输入的就是value值。 2 <input type="radio"/>,v-model收集的是value
先直接给出结论在连通图(通俗的解释 图中每一个顶点最少可以到达两根线。 同时我们把使用了此顶点的线段称之为此顶点的连通线)中。以顶点为圆心,则整个圆会被N个连通线划分成N个圆心角。如上图,顶点A的圆,被划分成1,2,3 圆弧角,则我们设AB边代表角2,AD代表角3,AC,代表角1,这样刚好一条边对应一个圆弧角。∠BAD和下一个角为∠DAC,可用AB边和下一边AD表示结论: 1.在连通图中,所有封闭
Vue组件的传参问题关于vue组件的传参分为父传子(props)和子传父($emit)这里为大家简单介绍以下如何实现传参 第一种:父传子(props)props: { //父组件传入的item数据 item: { type: Object, default: function () { return {}; }, },
转载 7月前
89阅读
前言上一篇文章中分析了render函数生成的主要细节,实际上主要是parse + generate解析template构建render函数的过程。当render函数构建过后,接下来就生成一个watcher实例,该实例与视图渲染密切相关,会触发render函数执行。实际上VNode对象的创建是在render调用过程中触发的,这是render函数本身的结构导致的。本文主要分析render调用过程中vn
转载 2024-10-19 10:18:41
50阅读
Class 与 Style 绑定 操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是 attribute,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可。不过,字符串拼接麻烦且易错。因此,在将 v-bind 用于 class 和 style 时,Vue.js 做了专门的增强。表达式结果的类型除了字符串之外,还可以是对象或数组。对象语法 我们可
vue render function h()
转载 2019-01-02 18:15:00
239阅读
1.函数式组件使用单文件定义函数式组件设置functional即表示该组件为一个函数式组件函数式组件不会有状态,不会有响应式数据,不会有生命周期钩子函数。可以把它当成把普通组件模板中的一部分 DOM 剥离出来,通过函数的方式渲染出来,是一种在 DOM 层面的复用。<template functional> <div class="cell"> <div v
vue中使用import()来代替require.ensure()实现代码打包分离   一、require.ensure() 方法来实现代码打包分离require.ensure() 是 webpack 特有的,已经被 import() 取代。 require.ensure( dependencies: Str
封闭曲线检测近期开发需求上有这么一个功能,用户自己通过画圈去查找物品。效果如下:那么问题来了,如何判断用户画的是一个封闭的曲线?从图上可知封闭曲线必然会存在至少一个交点,并且该交叉点是由尾部曲线回到起始点或穿过前面的曲线形成。交叉点在X轴和y轴上与曲线上的点都应存在距离。(排除曲线由起点到终点,再由终点回到起点。这种情况存在交叉点但它是一条直线)function getClosedCurvePoi
vue prop属性传值与传引用示例vue组件在prop里根据type决定传值还是传引用。简要如下:传值:String、Number、Boolean传引用:Array、Object若想将数组或对象类型也以值形式传递怎么办呢?如下方式可以实现:// component-A 引用component-B组件 :personBak="person_Bak"> // component-A 部分关键代
转载 2024-06-12 22:22:44
211阅读
目录一、axios语法介绍axios-get请求axios-post请求二、代码验证测试1、axios基本使用_get_post请求(1)实例代码(2)效果展示三、内容-总结上一节我们介绍了本章要学习的内容,对于接下来要介绍的知识点应该有了基本的概念,这一节我们将介绍axios的基本使用、介绍它是如何来发送请求以及获取响应的内容。一、axios语法介绍作为一个JS库,为了使用它,首先我们需要导包,
转载 2024-10-16 09:03:57
57阅读
  • 1
  • 2
  • 3
  • 4
  • 5