FullCalendar日历插件说明文档

news2024/11/20 1:30:39

一般标准配置

属性描述默认值
header设置日历头部信息。
如果设置为false，则不显示头部信息。包括left，center,right左中右三个位置，每个位置都可以对应以下不同的配置：
title: 显示当前月份/周/日信息
prev: 用于切换到上一月/周/日视图的按钮
next: 用于切换到下一月/周/日视图的按钮
prevYear：用于切换到上一年视图的按钮
nextYear：用于切换到下一年视图的按钮		{
left: 'title',
center: '',
right: 'today prev,next'
}
theme是否允许使用jquery的ui主题，如果设置为true，则需要加载jquery ui相关css和js文件。 查看演示false
buttonIcons设置header中使用的prev, next等变量对应按钮的样式，只有当theme为true时才有效，如果你调用了jQuery ui样式但又不想使用它的图标样式，可以将此属性设置为false{ prev: 'circle-triangle-w', next: 'circle-triangle-e' }
firstDay设置一周中显示的第一天是哪天，周日是0，周一是1，类推。0
isRTL设置为ture时则日历从右往左显示，貌似是针对阿拉伯人设计的。false
weekends是否显示周末，设为false则不显示周六和周日。true
hiddenDays隐藏一周中的某一天或某几天，数组形式，如隐藏周二和周五：[2,5]，默认不隐藏，除非weekends设置为false。[]
weekMode在月视图里显示周的模式，因为每月周数可能不同，所以月视图高度不一定。
fixed：固定显示6周高，日历高度保持不变
liquid：不固定周数，高度随周数变化
variable：不固定周数，但高度固定		'fixed'
weekNumbers是否在日历中显示周次(一年中的第几周)，如果设置为true，则会在月视图的左侧、周视图和日视图的左上角显示周数。false
weekNumberCalculation周次的显示格式。"iso"
height设置日历的高度，包括header日历头部，默认未设置，高度根据aspectRatio值自适应。
contentHeight设置日历主体内容的高度，不包括header部分，默认未设置，高度根据aspectRatio值自适应。
aspectRatio设置日历单元格宽度与高度的比例。1.35
handleWindowResize是否随浏览器窗口大小变化而自动变化。true
windowResizecallback，当浏览器窗口变化时触发function，使用：
$('#calendar').fullCalendar({
windowResize: function(view) {
alert('The calendar has adjusted to a window resize');
}
});
 
rendermethod，绑定日历到id上。
$('#id').fullCalendar('render');
destroymethod，销毁id日历，把日历回复到初始化前状态。
$('#id').fullCalendar('destroy');

 视图

FullCalendar插件有5类视图：包括month（月视图），basicWeek（基本周视图，左侧不显示具体时间），basicDay（基本日视图，左侧不显示具体时间），agendaWeek（周视图），agendaDay（日视图）。

View视图对象的属性：

属性描述
name包括month,basicWeek,basicDay,agendaWeek,agendaDay
title标题内容(例如"2013年9月" or "Sep 7 - 13 2013")
startDate类型, 该view下的第一天
endDate类型, 该view下的最后一天. 由于是一个闭合的值, 所以, 比如在month view下, 10月这个月份, 那么end对应的应该是11月的第一天
visStartDate类型. 在该view下第一个可以访问的day. month view下, 该值是当月的第一天, week view下, 则通常和start一致
visEndDate类型, 最后一个可访问的day
defaultView日历初始化时默认视图 默认值 ‘month’
getViewmethod，取得视图对象信息，如获取当前视图的标题内容：
var view = $('#calendar').fullCalendar('getView'); alert("The view's title is " + view.title);
changeViewmethod，切换视图
.fullCalendar('changeView',viewName)
viewName为5种视图中的一种
日程选项

以下选项设置适用于agendaWeek和agendaDay视图里。

属性描述默认值
allDaySlot在agenda视图模式下，是否在日历上方显示all-day(全天)true
allDayText定义日历上方显示全天信息的文本'all-day'
axisFormat设置日历agenda视图下左侧的时间显示格式，默认显示如：5:30pm'h(:mm)tt'
slotMinutes在agenda的视图中, 两个时间之间的间隔(分钟)30
defaultEventMinutes事件默认的时间执行长度，如果事件对象没有指定执行多长时间，则默认执行两个小时120
firstHour当切换到agenda时，初始滚动条滚动到的时间位置，默认在6点钟的位置6
minTime设置显示的时间从几点开始0
maxTime设置显示的时间从几天结束24
slotEventOverlap设置视图中的事件显示是否可以重叠覆盖true

 当前日期设置

属性描述默认值
year设置日历年份，必须为4位如：2013，如果不设置则默认为当前年份
month设置初始化日历的月份，从0开始，如果年份和月份都未指定，则从一月开始。
date设置日历初始化时的日期，只有在周视图和日视图中有效
prevmethod，进入到上一月（周、天）视图
$('#calendar').fullCalendar('prev');
nextmethod，进入到下一月（周、天）视图
$('#calendar').fullCalendar('next');
prevYearmethod，进入上一年视图
nextYearmethod，进入下一年视图
todaymethod，进入当天
gotoDatemethod，指定进入日历中的某一天
$('#calendar').fullCalendar( 'gotoDate', year [, month, [ date ]] )
incrementDatemethod， 以当前时间为轴, 将日历向前, 或向后移动指定长度的时间, 比如: $('#calendar').fullCalendar(‘incrementDate’, -3, 2, -5)就表示将日历年份向前移动3年, 月份向后移动2月, day(天数)向前移动5天。
getDatemethod，返回当前日历中的日期
文本与时间定制

你可以根据项目需求设置日历显示的文本信息，如中文的月份等。

属性描述默认值
timeFormat设置显示的日程事件的时间格式，如timeFormat: 'H:mm' 则显示24小时制的像10:30{agenda: ‘h:mm{ - h:mm}}
columnFormat设置显示日历每列表头信息的格式文本，默认：
{
month: 'ddd', // Mon
week: 'ddd M/d', // Mon 9/7
day: 'dddd M/d' // Monday 9/7 }		见描述
titleFormat设置用于显示日历头部的文本信息，默认：
{
month: 'MMMM yyyy', // September 2013
week: "MMM d[ yyyy]{ '—'[ MMM] d yyyy}", // Sep 7 - 13 2013
day: 'dddd, MMM d, yyyy' // Tuesday, Sep 8, 2013
}		见描述
buttonText设置日历头部各按钮的显示文本信息，默认：
{
prev: '‹', // ‹
next: '›', // ›
prevYear: '«', // «
nextYear: '»', // »
today: 'today',
month: 'month',
week: 'week',
day: 'day'
}		见描述
monthNames月份全称，默认：
['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']		见描述
monthNamesShort月份名称简写，默认：['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun' 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']见描述
dayNames星期全称，默认：['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']见描述
dayNamesShort星期名称简写，默认：['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']见描述
weekNumberTitle周次，即一年中的第几周"W"
鼠标单击和滑过

以下列出的是当鼠标单击或者滑过日历中的某个元素时，回调的函数callback

属性描述
dayClick/

dateClick(vue3)

当单击日历中的某一天时，触发callback，用法：
$('#calendar').fullCalendar({
dayClick: function(date, allDay, jsEvent, view) {
do something...
}
});
date是点击的day的时间(如果在agenda view, 还包含时间)，在月view下点击一天时，allDay是true，在agenda模式下，点击all-day的窄条时，allDay是true，点击其他的agenda view下的day则为false，jsEvent就是一个普通的javascript事件，包含的是click事件的基础信息。
eventClick当点击日历中的某一日程（事件）时，触发此操作，用法：
$('#calendar').fullCalendar({
dayClick: function(event, jsEvent, view) {
do something...
}
});
event是日程（事件）对象，jsEvent是个javascript事件，view是当前视图对象。
eventMouseover
eventMouseout		鼠标划过和离开的事件，用法和参数同上

 选择操作

属性描述默认值
selectable是否允许用户通过单击或拖动选择日历中的对象，包括天和时间。false
selectHelper当点击或拖动选择时间时，显示默认加载的提示信息，该属性只在周/天视图里可用。false
unselectAuto当点击页面日历以外的位置时，是否自动取消当前的选中状态。true
unselectCancel指定哪些元素不会清空当前的选中，以JQUERY选择器的方式指定 '#someId'。''
selectcallback，被选中的函数回调，使用方法：
function( startDate, endDate, allDay, jsEvent, view )
startDate：被选中区域的开始时间
endDate：被选中区域的结束时间
allDay：是否为全天事件
startDate：jascript对象
startDate：当前视图对象
 
unselectcallback，选中被取消时的回调，使用方法：
function( view, jsEvent )
selectmethod，选中某个时间，使用方法：
$('#calendar').fullCalendar( 'select', startDate, endDate, allDay )
unselectmethod，取消选中，使用方法：
$('#calendar').fullCalendar( 'unselect' )
日程事件数据

FullCalendar最重要的部分，设置用于日程事件相关信息。

Event Object，事件对象，用来存储一个日历事件信息的标准对象，只有title和start是必须的

属性描述
id可选，事件唯一标识，重复的事件具有相同的id
title必须，事件在日历上显示的title
allDay可选，true or false，是否是全天事件。
start必须，事件的开始时间。
end可选，结束时间。
url可选，当指定后，事件被点击将打开对应url。
className指定事件的样式。
editable事件是否可编辑，可编辑是指可以移动, 改变大小等。
source指向次event的eventsource对象。
color背景和边框颜色。
backgroundColor背景颜色。
borderColor边框颜色。
textColor文本颜色。

代码示例（根据需求添加属性）：

  events: matchList.value, //绑定展示事件
const matchList = ref([
  {
    id: '1',
    title: '情人节',
    start: '2023-11-06 13:22:24',
    allDay: true,
    color: '#fcdefa',
    textColor: '#6B7280'
  },
  {
    id: '11',
    title: '愚人节',
    start: '2023-11-16 13:22:24',
    allDay: true,
    color: '#ff5c93'
  },
  {
    id: '13',
    title: '劳动节',
    start: '2023-11-01 00:00:00',
    allDay: true,
    color: '#F59E0B',
    editable: false
  },
  {
    id: '2',
    title: '第五个任务',
    start: '2023-11-27 13:22:24',
    end: '2023-04-27 23:22:24',
    allDay: true,
    color: '#c45656'
  },
  {
    id: '4',
    title: '特定节日',
    start: '2023-11-08 13:22:24',
    end: '2023-11-12 23:22:24',
    allDay: true,
    color: '#5172dc'
  },
  {
    id: '88',
    title: '国庆节',
    start: '2023-10-01 13:22:24',
    end: '2023-10-07 23:22:24',
    allDay: true,
    color: '#fcdefa',
    textColor: '#6B7280'
  }
])
事件源对象

事件源即日历中的数据来源，FullCalendar提供了数组、函数调用、以及JSON数据的形式，当然也可以通过Google Calendar feed获取数据接口。helloweba.net后面会有文章专门介绍事件数据的操作，包括数据的查询、写入、更新和删除操作。

以下是Event事件相关的参数属性说明

属性描述默认值
eventSources事件源，存储数组对象，可以是Arrays/Functions/URLs。
allDayDefault是否为全天日程事件，显示这一天中所做的事情。true
ignoreTimezone是否忽略时区。true
startParam在使用URL方式获取events数据源的时候, 自动插入到URL中的参数, 表示当前需要抓取的日程事件的起始时间。'start'
endParam和startParam参数意义相同, 表示要抓取的日程事件的终止时间。'end'
lazyFetching是否从缓存信息获取event。比如从月视图切换到周视图。true
eventDataTransformcallback，将外部数据源转换成Fullcalendar可以处理的数据
loadingcallback，日历开始加载的时候，isLoading参数为true触发一次，日历加载完毕，isLoading参数为false触发一次，用法：
function(isLoading, view)
updateEventmethod，更新日历空间中的一个日程事件，如果是重复的日程事件，则都更新。用法：
$('#calendar').fullCalendar( 'updateEvent', event )
clientEventsmethod，返回FullCalendar已经存储到客户端的CalEvents对象数组， 第二个参数和removeEvents方法的第二个参数意义相同， 只不过在过滤器中， 如果返回true， 则该CalEvent对象将被加入到返回的数组中。
removeEventsmethod，从日历中删除一个日程事件. 第二个参数可以不填， 可以填id， 可以是一个过滤器(一个函数， 接受CalEvent对象作为参数)。用法：
$('#calendar').fullCalendar( 'removeEvents' [, idOrFilter ] )
refetchEventsmethod，重新抓取所有的日程事件源上的日程事件并渲染它们。
addEventSourcemethod，添加一个日程事件源，添加之后， FullCalendar会马上从该源获取日程事件， 并加载到日历中。第二个参数和定义Calendar时候使用的url参数一致。
removeEventSourcemethod，移除一个日程事件源，该源上获取得到的日程时间也将被马上从日历中移除。
 事件渲染
属性描述
eventColor
eventBackgroundColor
eventBorderColor
eventTextColor		设置日程事件的背景色和边框色，以及文本颜色。可以使用任意支持css的颜色方式，如 #f00, #ff0000, rgb(255,0,0), or red。
eventRendercallback，当日程事件渲染时触发，用法：
function(calEvent, element, view)
eventAfterRendercallback，当日程事件被渲染后触发，用法：
function( event, element, view ) { }
eventDestroycallback，当日程事件移出时触发，用法：
function( event, element, view ) { }
renderEventmethod，一旦日历重新取得日程源，则原有日程将消失，当指定stick为true时，日程将永久的保存到日历上。
rerenderEventsmethod，重新渲染所有事件。
日程事件拖动和缩放

拖动和缩放功能依赖于jQuery ui的draggable和resizable，所以在使用时要提前加载jQuery ui相关插件。

属性描述默认值
editable是否可编辑，即进行可拖动和缩放操作。false
eventStartEditable是否让事件在开始时就可以拖动。true
dragRevertDuration如果拖拽不成功，多久回复原状，毫秒500
dragOpacity拖动时候的不透明度。
{
agenda:.5 //对于agenda试图
'':1.0 //其他视图
}		见描述
eventDragStart,
eventDragStop		callback，日程事件被拖动之前和之后触发。这里的拖动不一定是一个有效的拖动，只要日程事件的控件被拖着动了，事件就触发。 可以从该对象中获取位移，位置等数据。用法： function( event, jsEvent, ui, view ) { }
eventDropcallback，当拖拽完成并且时间改变时触发，用法：
function( event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view ) { }
ayDelta 保存日程向前或者向后移动了多少天
minuteDelta 这个值只有在agenda视图有效，移动的时间
allDay 如果是月视图，或者是agenda视图的全天日程，此值为true,否则为false
eventResizeStart,
eventResizeStop		callback，在一个日程事件改变大小之前之后发生(不一定要改变成功)，用法：
function( event, jsEvent, ui, view ) { }
eventResizecallback，在日程事件改变大小并成功后调用, 参数和eventDrop参数用法一致。用法：
function( event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view ) { }
 日期工具
函数描述
formatDate格式化日期，通过指定的格式格式化一个日期，返回一个字符串。options选项是一个对象，其中设置本地化变量支持的属性值. 比如{ monthNames : ['一月'，'二月'，……]，dayNames: ['周日'，'周一'，…..]}，用法：
$.fullCalendar.formatDate( date，formatString [,options ] )
formatDates一次格式化两个日期，和上一个格式化日期类似，只不过，这里在formatString中使用大括号{…}来描述第二个日期的格式化方式。用法：
$.fullCalendar.formatDates( date1，date2，formatString [,options ] )
parseDate解析日期，将一个字符串格式成一个javascript的Date对象，这个string可以是ISO8601，IETF，UNIX时间戳三种格式。用法:
$.fullCalendar.parseDate( string )
parseISO8601将一个ISO8601字符串转换成一个javascript 的Date对象。用法：
$.fullCalendar.parseISO8601( string [,ignoreTimezone ] )

参考文献：

转载于:https://my.oschina.net/cng1985/blog/2249510

参考页面：

vue3源码：便于大家参考使用
<template>
  <ContentWrap>
    <FullCalendar
      ref="canledarRef"
      :options="calendarOptions"
      height="parent"
      :eventLimit="true"
      allDayText="全天"
      :editable="true"
      :buttonText="buttonText"
      @dates-render="datesRender"
    >
      <template #eventContent="arg">
        <b>{{ arg.event.title }}</b>
      </template>
    </FullCalendar>
    <Dialog v-model="dialogVisible" :title="dialogTitle">
      <Write ref="writeRef" />
      <template #footer>
        <ElButton type="primary" :loading="saveLoading" @click="save">
          {{ t('exampleDemo.save') }}
        </ElButton>
        <ElButton @click="dialogVisible = false">
          {{ t('dialogDemo.close') }}
        </ElButton>
      </template>
    </Dialog>
  </ContentWrap>
</template>

<script setup lang="ts">
import { ref, unref } from 'vue'
import { ContentWrap } from '@/components/ContentWrap'
import FullCalendar from '@fullcalendar/vue3'
import dayGridPlugin from '@fullcalendar/daygrid'
import timeGridPlugin from '@fullcalendar/timegrid'
import interactionPlugin from '@fullcalendar/interaction'
import multiMonthPlugin from '@fullcalendar/multimonth'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-icons/font/bootstrap-icons.css'
import bootstrap5Plugin from '@fullcalendar/bootstrap5'
import { ElButton } from 'element-plus'
import { useI18n } from '@/hooks/web/useI18n'
import { INITIAL_EVENTS, createEventId } from './event-utils'
import { Dialog } from '@/components/Dialog'
import { crm } from './yk'
import Write from './components/Write.vue'

const { t } = useI18n()
const writeRef = ref<ComponentRef<typeof Write>>()

const dialogVisible = ref(false)
const saveLoading = ref(false)
const dialogTitle = ref('添加日程')

const buttonText = ref({ today: '今日', month: '月', week: '周', day: '日', list: '日程' })

const datesRender = (calendar) => {
  const view = calendar.view
  console.log(view, '::viewviewview')
  // this.startTime = this.jnpf.toDate(view.activeStart, 'yyyy-MM-dd HH:mm')
  // this.endTime = this.jnpf.toDate(view.activeEnd, 'yyyy-MM-dd HH:mm')
  // this.initData()
}

const matchList = ref([
  {
    id: '1',
    title: '情人节',
    start: '2023-11-06 13:22:24',
    allDay: true,
    color: '#fcdefa',
    textColor: '#6B7280'
  },
  {
    id: '11',
    title: '愚人节',
    start: '2023-11-16 13:22:24',
    allDay: true,
    color: '#ff5c93'
  },
  {
    id: '13',
    title: '劳动节',
    start: '2023-11-01 00:00:00',
    allDay: true,
    color: '#F59E0B',
    editable: false
  },
  {
    id: '2',
    title: '第五个任务',
    start: '2023-11-27 13:22:24',
    end: '2023-04-27 23:22:24',
    allDay: true,
    color: '#c45656'
  },
  {
    id: '4',
    title: '特定节日',
    start: '2023-11-08 13:22:24',
    end: '2023-11-12 23:22:24',
    allDay: true,
    color: '#5172dc'
  },
  {
    id: '88',
    title: '国庆节',
    start: '2023-10-01 13:22:24',
    end: '2023-10-07 23:22:24',
    allDay: true,
    color: '#fcdefa',
    textColor: '#6B7280'
  }
])

const canledarRef = ref<ComponentRef<typeof FullCalendar>>()
const calendarOptions = ref({
  plugins: [dayGridPlugin, interactionPlugin, timeGridPlugin, bootstrap5Plugin, multiMonthPlugin],
  themeSystem: 'bootstrap5',
  initialView: 'multiMonthYear', // 默认为那个视图（月：dayGridMonth，周：timeGridWeek，日：timeGridDay）
  locale: 'zh-cn',
  initialEvents: INITIAL_EVENTS,
  customButtons: {
    myCustomButton: {
      text: 'custom',
      click: function () {
        alert('clicked the custom button!')
      }
    }
  },
  headerToolbar: {
    left: 'prevYear,prev,next,nextYear today',
    center: 'title',
    right: 'multiMonthYear,dayGridMonth'
  },
  fixedWeekCount: false, //因为每月起始日是星期几不固定，导致一个月的行数会不固定，是否固定行数
  aspectRatio: 1, //宽高比
  eventColor: '#0d6efd', //事件背景颜色
  handleWindowResize: true,
  events: matchList.value, //绑定展示事件
  //事件的点击
  eventClick: (info) => {
    info.el.style.borderColor = 'pink'
    if (confirm(`Are you sure you want to delete the event '${info.event.title}'`)) {
      info.event.remove()
    }
  },
  //点击日期info是单元格的信息
  dateClick: (info) => {
    let startTime = crm.toDate(info.date, 'yyyy-MM-dd HH:ss')
    let clickTime = crm.toDate(info.date, 'yyyyMMdd')
    let currTime = crm.toDate(new Date(), 'yyyyMMdd')
    if (clickTime < currTime) return
    dialogVisible.value = true
    let calendarApi = info.view.calendar
    calendarApi.addEvent({
      id: createEventId(),
      title: '明天記得吃飯',
      start: '2023-10-29',
      end: '2023-11-02'
    })
    if (clickTime == currTime) {
      // dialogVisible.value = true
      let thisDate = new Date()
      thisDate.setHours(thisDate.getHours() + 1)
      startTime.value = crm.toDate(thisDate, 'yyyy-MM-dd HH:00')
    }

    info.dayEl.style.backgroundColor = 'pink'
  },
  editable: true //事件是否可编辑，可编辑是指可以移动, 改变大小等。
  // //点击添加的事件
  // eventsSet: (events) => {
  //   currentEvents.value = events
  // },
})

const save = async () => {
  const write = unref(writeRef)
  const formData: any = await write?.submit()
  if (formData) {
    saveLoading.value = false
    const obj: any = {}
    obj.title = formData.content
    obj.start = crm.toDate(formData.starTime, 'yyyy-MM-dd HH:ss')
    obj.endTime = crm.toDate(formData.endTime, 'yyyy-MM-dd HH:ss')
    calendarOptions.value.events.push(obj)
    dialogVisible.value = false
    console.log(1)
  }
}
</script>

<style lang="less" scoped>
h2 {
  margin: 0;
  font-size: 16px;
}

ul {
  margin: 0;
  padding: 0;
}

li {
  margin: 0;
  padding: 0;
}

b {
  margin-right: 0;
}

.demo-app {
  display: flex;
  min-height: 100%;
  font-family:
    Arial,
    Helvetica Neue,
    Helvetica,
    sans-serif;
  font-size: 14px;
}

.demo-app-sidebar {
  // width: 300px;
  // line-height: 1.5;
  background: #eaf9ff;
  border-right: 1px solid #d3e2e8;
}

.demo-app-sidebar-section {
  padding: 2em;
}

.demo-app-main {
  flex-grow: 1;
  padding: 3em;
}

.fc {
  /* the calendar root */
  max-width: 1500px;
  max-height: 800px;
  margin: 0 auto;
}
</style>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1221488.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

蓝桥杯 map

蓝桥杯 map

map 代码示例 #include<iostream> #include<map> using namespace std; int main(){//创建并初始化mapmap<int,string> myMap{{1,"Apple"},{2,"Banana"},{3,"Orange"}} ;//插入元素myMap.insert(make_pair(4,"Grapes&qu…
阅读更多...
Simulink 自动代码生成电机控制：模型预测控制（MPC）模块使用总结（2）

Simulink 自动代码生成电机控制：模型预测控制（MPC）模块使用总结（2）

目录 设置预测范围对系统的影响 设置输入输出约束对系统的影响 设置权重对系统的影响 调整Close-Loop Performance 和State Estimation效果 检查MPC设计是否合理 总结 设置预测范围对系统的影响 预测范围越小&#xff0c;响应越快&#xff0c;预测性能越差&#xff0c;系统稳…
阅读更多...
Javascript if 语句使用详解

Javascript if 语句使用详解

Javascript if 语句使用详解 目录 Javascript if 语句使用详解 一、if语句 二、if……else语句 三、if……else if语句 if语句是使用最为普遍的条件选择语句&#xff0c;每一种编程语言的if语句都差不多。if语句类型共有3种&#xff1a; &#xff08;1&#xff09;if语句&…
阅读更多...
黔院长 | 何为风邪？

黔院长 | 何为风邪？

中医上所说的风&#xff0c;也称风邪&#xff0c;是指受到外界侵犯&#xff08;外邪&#xff09;而感得风寒、风热、风湿等症状&#xff0c;导致人的免疫力下降。寒、湿、燥、暑、热等都属于外邪&#xff0c;多依附于风而入侵人体&#xff0c;因此风邪更多的是指一种致病因素。…
阅读更多...
LED裸机

LED裸机

关于STM32的GPIO的初始化&#xff1a; 初始化&#xff1a; 时钟&#xff1b;输出/输入功能、上拉、速度等等&#xff1b;设置复用功能等等 回顾GPIO和IO&#xff1a; GPIO&#xff1a; 通用IO口。嵌入式系统中常常有数量众多&#xff0c;但是结构却比较简单的外部设备/电路&a…
阅读更多...
Python系列：如何提高python程序代码的健壮性

Python系列：如何提高python程序代码的健壮性

前言 在编程的时候,我们难免会遇到一些不可靠的情况,比如网络请求失败,数据库连接超时等等。这些不确定性会让我们的程序容易出现各种错误和异常。那么如何来增加程序的容错性和健壮性呢? 可能大多数人会想到使用try except来进行异常捕捉进行失败重试(Retry)。虽然try-esc…
阅读更多...
lvgl 画好一个圆弧arc 要了解的相关知识

lvgl 画好一个圆弧arc 要了解的相关知识

目录 一、概述 1. css盒子模型示意图2. 圆弧的理解对象3. lvgl 版本 二、功能细节 1. 圆弧的角度 1.1 圆弧的0度在哪里&#xff1f;1.2 设置圆弧角度的1.3 设置圆弧的背景角度 2. 圆弧的半径3. 圆弧的圆角 3.1 设置圆弧的圆角 效果如下&#xff1a; 4. 圆弧的宽度 4.1圆弧主体…
阅读更多...
基于SSM的宠物医院管理系统

基于SSM的宠物医院管理系统

基于SSM的宠物医院管理系统的设计与实现~ 开发语言&#xff1a;Java数据库&#xff1a;MySQL技术&#xff1a;SpringMyBatisSpringMVC工具&#xff1a;IDEA/Ecilpse、Navicat、Maven 系统展示 主页 后台 摘要 随着人们对宠物健康关注的增加&#xff0c;宠物医疗服务的需求也…
阅读更多...
云端力量：探索亚马逊云服务器，提升您的业务无限可能

云端力量：探索亚马逊云服务器，提升您的业务无限可能

文章目录 前言亚马逊云服务器简介亚马逊云服务器的优势使用步骤Amazon EC2 实例类型常见问题 总结 前言 随着大数据、人工智能和物联网等技术的飞速发展&#xff0c;企业对于高效、灵活和可扩展的计算需求日益增强。在这样的背景下&#xff0c;亚马逊云服务器 以其卓越的性能、…
阅读更多...
TSINGSEE青犀视频平台EasyCVR如何搭建自然保护区视频监控系统

TSINGSEE青犀视频平台EasyCVR如何搭建自然保护区视频监控系统

随着经济的发展与城市化进程&#xff0c;很多国家自然保护区不断被破坏&#xff0c;为了对国家自然保护区进行全面管理&#xff0c;加大保护区的防护管理力度&#xff0c;人工管理工作量十分繁重&#xff0c;并会存在一些漏洞。因此在国家自然保护区建立一套完整的视频监控系统…
阅读更多...
（免费）双相情感障碍筛查MDQ 在线测试双向情感障碍

（免费）双相情感障碍筛查MDQ 在线测试双向情感障碍

MDQ用于筛查双相障碍&#xff0c;主要包含13个关于双相障碍症状的是非问题&#xff0c;当前测试采用的量表为2010年杨海晨博士翻译版。该量表为目前世界范围内最常用的双相障碍筛查量表&#xff0c;目前在精神科门诊最为常用的量表之一。 双向情感障碍筛查量表&#xff0c;也叫…
阅读更多...
提取纯色马赛克

提取纯色马赛克

​​​​​​ 图像预处理 将彩色图像加载到内存。 转换图像为灰度图像&#xff0c;以简化处理。 对灰度图像应用二值化处理&#xff0c;将图像中的纯色区域分为前景和背景。这可以使用阈值处理来完成。 轮廓检测 使用轮廓检测算法&#xff0c;例如OpenCV的 findContours 函数&…
阅读更多...
①Redis String 字符串类型【命令汇总】

①Redis String 字符串类型【命令汇总】

个人简介&#xff1a;Java领域新星创作者&#xff1b;阿里云技术博主、星级博主、专家博主&#xff1b;正在Java学习的路上摸爬滚打&#xff0c;记录学习的过程~ 个人主页&#xff1a;.29.的博客 学习社区&#xff1a;进去逛一逛~ Redis String ①Redis String 字符串类型【命令…
阅读更多...
Linux 无名管道实现文件复制

Linux 无名管道实现文件复制

无名管道 通过一个管道&#xff08;假象&#xff09;进行传输数据&#xff0c;但是这个管道的传输方式是单工&#xff08;半双工&#xff09;的&#xff0c;就是这个管道允许进行发送和接受数据&#xff0c;不过不能同时进行。 创建无名管道 这里用到一个pipe&#xff08;&…
阅读更多...
微软Ignite 2023大盘点：GPT-4 Turbo、DALL-E 3等

微软Ignite 2023大盘点：GPT-4 Turbo、DALL-E 3等

11月16日&#xff0c;微软在美国西雅图举办“Microsoft Ignite 2023”全球开发者大会。ChatGPT等生成式AI成为了本次大会的重要主题。 下面「AIGC开放社区」将根据大会发布的内容&#xff0c;盘点重要内容。 GPT-4 Turbo、 DALL E 3等全新模型 16K上下文的新GPT-3.5 Turbo模…
阅读更多...
视频桥接IC LT8711UXC适用于4LANE TYPE-C/DP转HDMI，另支持支持HDCP协议，分辨率高达4K60HZ！

视频桥接IC LT8711UXC适用于4LANE TYPE-C/DP转HDMI，另支持支持HDCP协议，分辨率高达4K60HZ！

1.描述 应用功能&#xff1a;LT8711UXC适用于TYPE-C转HDMI2.0&#xff0c;DP1.4转HDMI2.0应用方案&#xff0c;另HDMI带HDCP协议 分辨率&#xff1a;支持4K60HZ 工作温度范围&#xff1a;−40C to 85C 产品封装&#xff1a;QFN48 (6*6&#xff09;最小包装数&#xff1a;4900pc…
阅读更多...
给openlab搭建web网站

给openlab搭建web网站

网站需求&#xff1a; 1、基于域名 www.openlab.com 可以访问网站内容为 welcome to openlab!!! 2、给该公司创建三个子界面分别显示学生信息&#xff0c;教学资料和缴费网站 1&#xff09;基于 www.openlab.com/student 网站访问学生信息 2&#xff09;基于 www.openlab.com/…
阅读更多...
今天遇到Windows 10里安装的Ubuntu（WSL）的缺点

今天遇到Windows 10里安装的Ubuntu（WSL）的缺点

随着技术的发展&#xff0c;越来越多开发者转向使用 Windows Subsystem for Linux&#xff08;WSL&#xff09;在 Windows 10 上进行开发&#xff0c;也就是说不用虚拟机&#xff0c;不用准备多一台电脑&#xff0c;只需要在Windows 10/11 里安装 WSL 就能体验 Linux 系统。因此…
阅读更多...
最大似然估计的介绍

最大似然估计的介绍

最大似然估计&#xff08;Maximum Likelihood Estimation&#xff0c;简称MLE&#xff09;是一种用于估计概率分布中参数的方法。该方法的核心思想是选择使得观察到的数据在给定模型下出现的概率最大的参数值作为估计值。 最大似然估计具有很好的性质&#xff0c;包括渐进正态性…
阅读更多...
新手老师怎么发布班级查询？

新手老师怎么发布班级查询？

现在科技发展飞快&#xff0c;班级查询系统已经成为了许多学校必备的教务工具。可以让学生们快速查找到班级的各项信息&#xff0c;包括但不限于课程安排、考试成绩、分班等。对老师来说&#xff0c;班级查询系统可以提高工作效率&#xff0c;减少重复劳动&#xff0c;学生或者…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023