Sg.js框架
Sg.js是国内知名前端开发团队发起的,以开发者为核心的轻型前端框架,意在减轻html端标签编写负担,将工作量转移到控件核心,轻量化便捷传参的方式让页面重构,丰富的实用工具集将是前端开发高效快捷的保障,目前已经有200多名前端极客贡献代码进行完善框架,后期将会有更多开发人员加入!
你挚爱的强哥
我以为,世上的程序语言确实没有高低之分,只有编程的人才有强弱之别,通过写代码我们可以发现和认识一个真正的自己,因为我们真正的对手,可能就是我们自己。
展开
-
【sgSearch_v3】自定义组件:自由定义折叠和展开显示的控件,更加自由灵活,展开后更多搜索内容悬浮于其他组件之上,不影响整体布局高度)。
【代码】【sgSearch】自定义组件:常用搜索栏筛选框组件(包括表格高度变化兼容)。_搜索框高度变化 表格。【sgSearch】自定义组件:常用搜索栏筛选框组件(包括表格高度变化兼容)。_搜索框高度变化 表格-CSDN博客。【sgSearch_v2】自定义组件:常用搜索栏筛选框组件(展开后更多搜索内容悬浮于其他组件之上,不影响整体布局高度)。原创 2024-05-10 14:43:30 · 363 阅读 · 0 评论 -
【sgSearch_v2】自定义组件:常用搜索栏筛选框组件(展开后更多搜索内容悬浮于其他组件之上,不影响整体布局高度)。
【代码】【sgSearch】自定义组件:常用搜索栏筛选框组件(包括表格高度变化兼容)。_搜索框高度变化 表格。【sgSearch】自定义组件:常用搜索栏筛选框组件(包括表格高度变化兼容)。_搜索框高度变化 表格-CSDN博客。原创 2024-04-28 14:18:11 · 222 阅读 · 0 评论 -
MessageBox 弹框 全局方法$msgbox, $alert, $confirm 和 $prompt常用代码片段
【代码】MessageBox 弹框 全局方法$msgbox, $alert, $confirm 和 $prompt常用代码片段。原创 2024-03-25 22:04:06 · 446 阅读 · 0 评论 -
用dragstart、drag、dragend、dragover、drop、dragleave实现针对表格列的顺序进行拖拽排序(附带实现选择某几列数据显示或隐藏)
将数组指定索引位置的元素 移动到 目标索引位置,且不改变其他元素原本的顺序,注意这个不是对调元素位置,是移动某一个元素位置不影响其他元素顺(使用场景:拖拽改变数据的顺序,点击上下左右箭头移动元素顺序)-CSDN博客。【代码】将数组指定索引位置的元素 移动到 目标索引位置(使用场景:拖拽改变数据的顺序,点击上下左右箭头移动元素顺序)原创 2024-03-17 21:10:14 · 523 阅读 · 0 评论 -
将数组指定索引位置的元素 移动到 目标索引位置,且不改变其他元素原本的顺序,注意这个不是对调元素位置,是移动某一个元素位置不影响其他元素顺(使用场景:拖拽改变数据的顺序,点击上下左右箭头移动元素顺序)
将数组指定索引位置的元素 移动到 目标索引位置,且不改变其他元素原本的顺序,注意这个不是对调元素位置,是移动某一个元素位置不影响其他元素顺(使用场景:拖拽改变数据的顺序,点击上下左右箭头移动元素顺序)-CSDN博客。【代码】将数组指定索引位置的元素 移动到 目标索引位置(使用场景:拖拽改变数据的顺序,点击上下左右箭头移动元素顺序)用dragstart、drag、dragend、dragover、drop、dragleave实现针对表格列的顺序进行拖拽排序(附带实现选择某几列数据显示或隐藏)-CSDN博客。原创 2024-03-17 19:41:45 · 406 阅读 · 0 评论 -
【实用模板】Vue代码文件常规模板
【代码】❤❤❤常用模板❤❤❤Vue常用后台管理系统增删改查列表(表格)模板。【代码】【实用模板】Vue代码文件常用后台管理页面模板。❤❤❤常用模板❤❤❤Vue常用后台管理系统增删改查列表(表格)模板_测试增删改查的测试表格-CSDN博客。【实用模板】Vue代码文件常用创建或编辑抽屉_vue2 抽屉表单新增编辑-CSDN博客。【实用模板】Vue代码文件常用弹窗页面组件_vue好看的弹窗布局模板-CSDN博客。【实用模板】Vue代码文件常用后台管理页面模板_vue页面模板-CSDN博客。原创 2021-09-07 08:17:45 · 5495 阅读 · 0 评论 -
【通用CSS模板】移动端H5页面统一样式.css
【代码】【通用CSS模板】移动端H5页面统一样式.css。原创 2021-08-23 20:59:09 · 6152 阅读 · 0 评论 -
❤❤❤常用模板❤❤❤Vue常用后台管理系统增删改查列表(表格)模板
【代码】❤❤❤常用模板❤❤❤Vue常用后台管理系统增删改查列表(表格)模板。原创 2023-12-08 08:23:45 · 473 阅读 · 0 评论 -
使用Vant框架的组件van-pull-refresh搭配van-list和van-card完成上滑加载更多列表数据,下拉刷新当前列表数据(等同于翻页功能)
<template> <div class="sg-page-body"> <div class="sg-list"> <van-pull-refresh v-model="pullLoading" @refresh="onPullRefresh" success-text="刷新成功" > <van-list v-model="listLoading" @load="o.原创 2020-06-29 15:13:33 · 9863 阅读 · 0 评论 -
Vue父组件调用子组件的方法并传参的两种方式(用$refs.refName.functionName、window.function)
子组件son.vue<template> <div class="sg-son"> <button @click="func(false)">子组件调用自己的方法</button> </div></template><script>export default { methods: { func(isFather) { alert(isFather ? "父组件调用子组件原创 2021-08-26 00:51:56 · 5690 阅读 · 0 评论 -
vue element upload组件配合axios实现用 “Content-Type“: “multipart/form-data“上传方式导入xls文件
elementUI el-upload上传组件实战使用。原创 2021-06-14 23:54:25 · 6392 阅读 · 1 评论 -
Vue中子组件单个双向绑定发送事件使用input,多个使用 update:变量名;父组件接收时,v-model 接收单个,.sync 接收多个(vue3中使用v-model:name的写法)
单个双向绑定发送事件使用$emit('input',父级监听到的值),且变量名必须用value;多个双向绑定使用$emit('update:变量名',父级监听到的值);父组件接收时,v-model 接收单个,:变量名.sync 接收多个(vue3中使用v-model:name的写法)原创 2023-05-30 08:55:33 · 243 阅读 · 0 评论 -
uni-app uni-file-picker 上传组件实战应用
【代码】uni-app uni-file-picker 上传组件实战应用。原创 2023-06-16 09:13:31 · 2636 阅读 · 0 评论 -
【微信小程序】之单选框、radio-group、radio组件使用
wxml<radio-group bindchange="radioChange"> <label wx:for="{{radioItems}}" wx:key="*this"> <radio value="{{item.value}}" checked="{{item.checked}}" /> {{item.name}} </label></radio-group>jsPage({ data: {原创 2021-10-24 20:06:40 · 12782 阅读 · 0 评论 -
【微信小程序】之轮播图、swiper、swiper-item、banner组件使用
wxml<swiper indicator-dots autoplay interval='3000'> <swiper-item wx:for="{{swipertItems}}" wx:key="*this"> <image src="{{item}}" mode="aspectFill" /> </swiper-item></swiper>wxssswiper { width: 100%; heigh原创 2021-10-24 19:34:59 · 5816 阅读 · 0 评论 -
使用uniapp的扩展组件,在微信小程序中出现报错如何解决
下的组件的,导致条件编译等功能失效 ,导致组件异常 需要在根目录创建。cli 项目默认是不编译。原创 2023-06-12 13:00:13 · 1074 阅读 · 0 评论 -
获取component组件的name名称
此外,this.$options.还可以获取data()、methods、created()、watch等等信息。在组件自身内部console.log(this.$options.name) 可以获取自己的name。sgComponent.name 就是组件的name。方法2:this.$options.name。方法1:component.name。原创 2023-07-07 11:17:39 · 2312 阅读 · 0 评论 -
推荐几个超好用的Office文档(Word:doc/docx、Excel:xls/xlsx、pdf、ppt/pptx、txt、zip/rar、jpg/jpeg/gif/bmp/gif)在线预览组件
word、doc、pdf预览Excel表格预览幻灯片预览压缩包预览。原创 2023-07-01 11:36:49 · 301 阅读 · 0 评论 -
Angular使用@Input和@Output实现父子组件互相传参(类似Vue的props和this.emit)
app.component.html<sg [in]='"传输进入"' (out)="out($event)" ></sg>app.component.tsimport { Component } from '@angular/core';@Component({ selector: 'app-root', templateUrl: './app.component.html'})export class AppComponent { out($ev原创 2021-09-20 19:43:13 · 5597 阅读 · 0 评论 -
elementUI el-upload上传组件实战使用
vue element upload组件配合axios实现用 “Content-Type“: “multipart/form-data“上传方式导入xls文件_你挚爱的强哥的博客-CSDN博客。elementUI el-upload上传组件实战使用。原创 2023-06-04 11:38:55 · 309 阅读 · 0 评论 -
el-date-picker组件的picker-options常规属性设置
【代码】el-date-picker组件的picker-options常规属性设置。原创 2023-07-17 15:53:29 · 2284 阅读 · 1 评论 -
Vue使用vue-3d-model组件预览3D三维文件、立体文件,支持旋转、自动播放
基于threeJS的vue 3D展示组件。原创 2023-07-01 18:58:42 · 4353 阅读 · 9 评论 -
解决uniapp scroll-view组件滚动报错Ignored attempt to cancel a touchmove event with cancelable=false
添加 @touchmove.stop 即可。原创 2023-06-18 18:51:39 · 657 阅读 · 1 评论 -
HTML5原生视频播放器组件video的videocontrolslist属性详解
HTML5提供了内置的视频播放控件,其中videocontrolslist是其中一个很有用的属性。videocontrolslist属性可以用于告诉浏览器在视频播放过程中应该显示哪些默认的用户界面控件。下面我们将从几个方面来介绍videocontrolslist的详细使用。原创 2023-11-27 10:36:55 · 1983 阅读 · 0 评论 -
Vue子组件调用父组件方法并传参的5种方式:$emit触发、传入子组件function、访问父组件$parent.function、用inject关联父组件provide的方法、用window.fun
子组件child.vue。父组件father.vue。原创 2021-09-04 08:52:38 · 8364 阅读 · 0 评论 -
基于elementUI的el-table组件实现按住某一行数据上下滑动选中/选择或取消选中/选择鼠标经过的行。拖拽选择上下行数据。
【代码】基于elementUI的el-table组件实现按住某一行数据上下滑动选中/选择或取消选中/选择鼠标经过的行。原创 2024-01-11 13:14:42 · 1319 阅读 · 0 评论 -
Angular多个页面引入同一个组件报错The Component ‘MyComponentComponent‘ is declared by more than one NgModule怎么办?
有一天,我写了一个自信满满的自定义组件myComponent,在多个页面import使用了,结果控制台给我来这个我特么裤子都脱了,你给我来这个提示是几个意思仔细一看 The Component 'MyComponentComponent' is declared by more than one NgModule什么鬼?说我的组件被多个模块使用?搞什么飞机,我就是要多个页面使用呀!!!于是乎查阅官方文档发现一个shared.module.ts的东东首先找一个干净的文件夹创建一原创 2022-03-29 22:43:54 · 3901 阅读 · 0 评论 -
Angular父组件调用子组件里面的方法
【代码】Angular父组件调用子组件里面的方法。原创 2022-04-26 01:18:47 · 3938 阅读 · 1 评论 -
elementUI引用el-image-viewer组件全局方法预览大图
【代码】elementUI引用el-image-viewer组件全局方法预览大图。原创 2023-05-16 15:07:44 · 484 阅读 · 0 评论 -
el-cascader组件实现点击、递归勾选联动子集children所有选项被选中。
【代码】el-cascader组件实现点击、递归勾选联动子集children所有选项被选中。原创 2023-06-28 10:06:23 · 710 阅读 · 0 评论 -
el-upload实现上传文件夹(批量上传文件),支持按钮式触发click()唤起上传弹窗(有助于少写一些el-upload节点,做到写一个el-upload组件多处使用)
/让el-upload支持上传文件夹。【sgUploadTray】上传托盘自定义组件,可实时查看上传列表进度_你挚爱的强哥的博客-CSDN博客。【sgUploadTray】上传托盘自定义组件,可实时查看上传列表进度。el-upload实现上传文件夹(批量上传文件):关键代码在于。sgUploadTray组件在这里。原创 2023-07-14 13:37:29 · 3429 阅读 · 6 评论 -
自定义video样式,设置div为视频实时预加载宽度和高度
【代码】自定义video样式,设置div为视频实时预加载宽度和高度。原创 2021-08-24 21:22:21 · 5908 阅读 · 0 评论 -
【微信小程序】之自定义三宫格一行展示row-grid(简单数据看板)
wxml<view class="row-grid"> <view class="row-grid-item" wx:for="{{rowGridItems}}" wx:key="*this" bindtap="rowGridTap"> <text class="num">{{item.num}}</text> <view class="title"> <image src="{{item.imgUrl}原创 2021-10-26 08:33:16 · 6487 阅读 · 0 评论 -
浅谈Angular如何自定义创建指令@Directive
知识普及Angular 指令根据其创建形式分为内置指令和自定义指令,指令按照类型分:模板指令——组件就是模板指令(只能自定义)属性型指令—— 更改元素、组件或其他指令的外观或行为的指令(有内置和自定义两类)结构型指令—— 通过添加和删除 DOM 元素来更改 DOM 布局的指令(有内置和自定义两类)举例:内置属性型指令常用的有:NgClass —— 添加和删除一组 CSS 类NgStyle —— 添加和删除一组 HTML 样式NgModel —— 将数据双向绑定添加到 HTML 表...原创 2021-10-06 08:34:38 · 6029 阅读 · 0 评论 -
vue自定义组件 → 场馆预约の小时范围控件【手到擒来】
组件<template> <ul> <li v-for="(item, $index) in hours" :key="$index" @click="click(item)" :disabled="disableHours.includes(item)" :active="active(item)" :startAndEndOk="startAndE...原创 2020-04-07 04:25:23 · 5640 阅读 · 3 评论 -
【说人话】真正意义上讲清楚了如何用$emit()在Vue.js的自定义组件中实现v-model=“”双向绑定
组件代码:<template> <div class="sg-component"> </div></template><script> export default { props: ["modelValue"],//单项绑定(这个modalValue叫什么不重要,重要是保持一致,避开关键词,用于接收父组件v-model=后面传过来的值) model: {原创 2020-08-28 12:42:08 · 4935 阅读 · 0 评论 -
CSS自定义鼠标样式。JS获取鼠标坐标,实现提示气泡框跟随鼠标移动
cursor: url(//img.58cdn.com.cn/resource/xxzl/captcha/pencil.png), default;/*获取鼠标位置,让提示气泡框跟随鼠标*/var sgTip=document.querySelector("#sgTip")document.addEventListener("mousemove", e => { console.log(e.clientX, e.clientY); sgTip.styl...原创 2021-08-15 15:03:55 · 5222 阅读 · 0 评论 -
自定义国内maven镜像包设置settings.xml
直接复制以下代码创建一个名为settings.xml的文件,放到C:\Users\Administrator\.m2下即可。原创 2020-10-07 15:05:11 · 8645 阅读 · 1 评论 -
【微信小程序】之自定义四宫格(不用mp-grids扩展组件实现,这个组件太难用了)
【代码】【微信小程序】之自定义四宫格(不用mp-grids扩展组件实现,这个组件太难用了)原创 2021-10-25 23:46:46 · 8141 阅读 · 6 评论 -
原生JS【fiveKeyPress】2秒内五次点击键盘任意键(或组合键)触发自定义事件(以Pause/Break键为例)
看文章之前来一个热身吧[JavaScript键码表]身为一个键盘侠,不搞清楚键码映射表怎么可以???_你挚爱的强哥(http://www.shuzhiqiang.com)-CSDN博客keycode 0 =keycode 1 =keycode 2 =keycode 3 =keycode 4 =keycode 5 =keycode 6 =keycode 7 =keycode 8 = BackSpacekeycode 9 = Tabkeycode 10 =keycode 11 =keycode 12 = Cle原创 2021-09-24 01:03:05 · 5553 阅读 · 0 评论