标题定义Vue组件什么是组件:组件的出现,就是为了拆分Vue实例的代码量的,能够让我们以不同的组件,来划分不同功能模块,将我们需要什么样的功能,就可以对调用对应的组件即可。组件化和模块化的不同:模块化:是从代码逻辑的角度进行划分的;方便代码的的分层开发,保证每个功能的职能单一;组件化:是从UI界面的角度进行划分的;前端的组件化,方便UI组件的重用。创建组件的方式:
1.使用Vue.extend 来            
                
         
            
            
            
            组件化组件化的实现和使用步骤1.1 注册组件的基本步骤1.2 组件化的基本使用全局组件和局部组件父组件和子组件注册组件语法糖组件模块抽离方法组件数据的存放组件中的data为什么必须是函数?父子组件的通信父传子props驼峰标识子传父父子组件通信—结合双向绑定案例父子组件访问父访问子 children-refs子访问父 parent-root 组件化的实现和使用步骤组件化: 如果我们将一个页面所有            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-04-09 14:41:36
                            
                                62阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            前端开发始终绕不过的就是操作DOM,在以前,我们使用Jquery,zepto等库来操作DOM,之后在vue,Angular,React等框架出现后,我们通过操作数据来控制DOM(绝大多数时候),越来越少的去直接操作DOM,更不用说用原生的JS来操作DOM了。但是并不是所有时候都一定要引入这些库,对于基础的JS操作DOM的一些方法,还是要有些了解的。这里就算是回顾一下JS那些熟悉却也陌生的DOM操作            
                
         
            
            
            
              javascript原生的事件,总结了一下,包括事件流、处理函数、事件对象这几样东西。而在兼容性方面,主要是老牌ie8以及以下和现代浏览器的差异,也就是ie和DOM事件标准的差异。事件流这个事件流ie4和Netscape4提出来的,但是两个公司提出的事件流确实刚好相反的。ie的是事件冒泡,Netscape的是事件捕获。ie会从触发事件的元素一直往上冒泡直到document元素。如图ie8以下包            
                
         
            
            
            
            一、<div>
    <p>123</p>
</div>在上面这段代码中,如果使用以下js代码var oDiv=document.getElementByTagName("div")[0];
alert(oDiv.firstChild.nodeName)在ie9以下,alert出来的是p(p标签名字),但是在现代浏览器下,比如Chrome,FF,i            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-09-12 10:13:57
                            
                                144阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            大家看到createElement方法,自然就想到了document.createElement()了。没错,这两个方法的名字是一样的。但是,这里我们要介绍的是React.createElement()而不是document.createElement()。下面我们直接进入正题React.createElement首先我们看官方给出的解释ReactElement createElement(
              
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-08-03 08:46:57
                            
                                207阅读
                            
                                                                             
                 
                
                             
         
            
            
            
              这是一个轮播图组件,这里是代码地址,需要传入容器的id和图片地址,支持Internet Explorer 10+、Firefox、Opera和Chrome等现代浏览器。  之前写一些功能或是特效都是写在一个个函数里,可能因为我是由c语言入门编程,所以更倾向于面向过程的编程方式,没有想过将一个模块抽象成为对象,做成组件。但是由于尝到了重复造轮子之苦。我决定将不可复用的代码做成组件,提高编程效率。            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-06-01 00:53:46
                            
                                108阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            一、Element 插件1. 找到要应用的插件1)打开Element 官网:Element - The world's most popular Vue UI framework2)下滑找到如图示画面,点击组件框3) 找到组件目录,其下面都是可应用的组件,本文以组件目录下的Button 按钮为例4)点击Button 按钮,下图页面,鼠标移动到页面框里,框底部会出现显示代码,点击显示代码即            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-05-05 12:01:33
                            
                                565阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            随着业务发展,公司总会面临组织架构的优化调整。同一个项目所属部门之间常有合并或者调整;公司成本中心或利润中心有了删减变动,或者因为业务需求而调整;公司发生重大重组,历史预算数据的报表重分类……面对这些复杂变动调整,不同时间节点的财务报表和预算数据带来的工作量数以周记。那您是否仍在花费大量人力成本和时间追踪调整呢?亦或是终究费尽心思收集完所有调整,但在数据迁移校验时,仍需花费同等时间保证数据的准确性            
                
         
            
            
            
            1.按F12审查元素,找到要修改的元素的类名2.新增style标签(注意!一定不能带scoped属性),在style作用域内设置样式            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-09-27 11:53:46
                            
                                477阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            基本架构mapbox的架构有些奇怪,接口层和逻辑层其实没有明确的区分。mapbox中style是一个比较重要的类,统辖整个数据层次。Painter中集成了draw和style两个模块 数据处理流程数据加载和流程渲染 数据的加载与解析在source中;主要有两部分组成,逻辑部分在主线程中比如:vector_tile_source、geojson_source中而实际的加载解析则是            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-07-20 15:48:24
                            
                                59阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            在html5中,新增了很多语义化的标签。如footer、header之类的,今天的主角是dialog标签顾名思义,就是用来定义对话框的。目前只有Chrome和Safari支持该标签,所以用的不多,不过确实挺好用的别担心,有官方的polyfill。       使用方法1. 基础的用法可以open属性控制dialog是否显示,效果如下:       看看浏览器渲染的默认样式:       是挺丑的,            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-11-20 12:37:11
                            
                                188阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            前言组件是前端的发展方向,现在流行的 React 和 Vue 都是组件框架。 谷歌公司由于掌握了 Chrome 浏览器,一直在推动浏览器的原生组件,即 Web Components API。相比第三方框架,原生组件简单直接,符合直觉,不用加载任何外部模块,代码量小。目前,它还在不断发展,但已经可用于生产环境。怎么说呢,无意中就发现了这个东西,感觉很有意思,打算学习研究一下。参考:Web Compo            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-02-24 16:30:53
                            
                                89阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            Tab相信大家都不会陌生,他算是前端开发中最常见的组件之一。接下来我就跟大家分享一个我用原生JavaScript实现的一个简单的组件化Tab。首先是HTML结构,没什么好说的了吧。<div id="tab1">
	<ul class="tab-head">
		<li>tab1</li>
		<li>tab2</li>
		&            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-03-05 03:42:06
                            
                                57阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            一.学习DOM之前需要知道的1.什么是window? window:是一个全局对象, 代表浏览器中一个打开的窗口, 每个窗口都是一个window对象2.什么是document?        document是window的一个属性, 这个属性是一个对象  &            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-10-09 19:33:16
                            
                                78阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            1.数组检测obj instanceof Array//trueArray.isArray(obj)//trueObject.prototype.toString.call(obj)//"[object Array]"2.转换方法arr.toString()、arr.valueOf()3.栈方法push()在数组末端推入,pop()在数组末端弹出4.队列方法shift()返回数组第一项,数组长度减            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-12-15 20:07:46
                            
                                83阅读
                            
                                                                             
                 
                
                             
         
            
            
            
             文件上传是最古老的互联网操作之一,20多年来几乎没有怎么变化,还是操作麻烦、缺乏交互、用户体验差。 一、前端代码 英国程序员Remy Sharp总结了这些新的接口 ,本文在他的基础之上,讨论在前端采用HTML5的API,对文件上传进行渐进式增强: * iframe上传 * ajax上传 * 进度 ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-09-08 09:50:00
                            
                                140阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            7个常用的原生JS数组方法一、Array.map()二、Array.filter()三、Array.reduce()四、Array.forEach()五、Array.find()六、Array.every()七、Array.some()总结 一、Array.map()作用: 循环遍历数组并修改,在原数组基础上返回一个新的修改版本,原数组不变。代码:let arr = [{name: 'hl',a            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-12-20 05:16:13
                            
                                64阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            一、原生js实现ajax$.ajax({
  url: '',
  type: 'post',
  data: {name: 'zhaobao', age: 20},
  dataType: 'json',
  success: function (data) {
  },
  error: function () {
  }
})
function ajax(options) {
  opt            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-08-07 14:40:20
                            
                                163阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            JS 实现 Promise===============MDN Promise 参考地址: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise
  github源码地址:https://github.com/ronliruonan/sv-boo            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-04-24 06:46:15
                            
                                25阅读