WPF MaterialDesign 初学项目实战（3）动态侧边栏

其他文章

WPF MaterialDesign 初学项目实战（0）:github 项目Demo运行
WPF MaterialDesign 初学项目实战（1）首页搭建
WPF MaterialDesign 初学项目实战（2）首页导航栏样式

创建侧边栏实体类

新建MenuBar文件

  • Common
    • Models
      • MenuBar

在这里插入图片描述

添加基本成员

using MaterialDesignColors.Recommended;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace MyToDo.Common.Models
{
    /// <summary>
    /// 系统导航菜单
    /// </summary>
    public class MenuBar : BindableBase//继承BindableBase可以动态修改
    {
        /// <summary>
        /// 菜单图标
        /// </summary>
        public string? Icon { get; set; }

        /// <summary>
        /// 标题
        /// </summary>
        public string? Title { get; set; }   

        /// <summary>
        /// 命名空间
        /// </summary>
        public string? NameSpace { get; set; }

    }
}

创建Views和ViewModels文件夹

注意,Views和VIewModels文件夹的名字是一定要这么写，这和Prism框架的自动绑定有关
绑定关系为：

  • Views
    • xxxView
  • ViewModels
    • xxxViewModel

自动绑定命名空间为：

xmlns:prism="http://prismlibrary.com/"
prism:ViewModelLocator.AutoWireViewModel="True"

在这里插入图片描述
创建MainView和MainViewModel文件
在这里插入图片描述
将MainWindow内容复制到MainView里面，将命名空间进行修改

<Window x:Class="MyToDo.Views.MainView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:MyToDo"
        mc:Ignorable="d"
        Title="MainWindow"
        Height="768"
        Width="1280"
        xmlns:prism="http://prismlibrary.com/"
        prism:ViewModelLocator.AutoWireViewModel="True"        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
        TextElement.Foreground="{DynamicResource MaterialDesignBody}"
        TextElement.FontWeight="Regular"
        TextElement.FontSize="13"
        TextOptions.TextFormattingMode="Ideal"
        TextOptions.TextRenderingMode="Auto"
        WindowStartupLocation="CenterScreen"
        WindowStyle="None"
        Background="{DynamicResource MaterialDesignPaper}"
        FontFamily="{DynamicResource MaterialDesignFont}">
    <materialDesign:DialogHost DialogTheme="Inherit"
                               Identifier="RootDialog"
                               SnackbarMessageQueue="{Binding ElementName=MainSnackbar, Path=MessageQueue}">

        <materialDesign:DrawerHost IsLeftDrawerOpen="{Binding ElementName=MenuToggleButton, Path=IsChecked}">
            <materialDesign:DrawerHost.LeftDrawerContent>
                <DockPanel MinWidth="220">

                </DockPanel>
            </materialDesign:DrawerHost.LeftDrawerContent>

            <DockPanel>
                <materialDesign:ColorZone Padding="16"
                                          x:Name="MainBody"
                                          materialDesign:ElevationAssist.Elevation="Dp4"
                                          DockPanel.Dock="Top"
                                          Mode="PrimaryMid">
                    <DockPanel LastChildFill="False">
                        <StackPanel Orientation="Horizontal">
                            <ToggleButton x:Name="MenuToggleButton"
                                          AutomationProperties.Name="HamburgerToggleButton"
                                          IsChecked="False"
                                          Style="{StaticResource MaterialDesignHamburgerToggleButton}" />

                            <Button Margin="24,0,0,0"
                                    materialDesign:RippleAssist.Feedback="{Binding RelativeSource={RelativeSource Self}, Path=Foreground, Converter={StaticResource BrushRoundConverter}}"
                                    Command="{Binding MovePrevCommand}"
                                    Content="{materialDesign:PackIcon Kind=ArrowLeft,
                                                        Size=24}"
                                    Foreground="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"
                                    Style="{StaticResource MaterialDesignToolButton}"
                                    ToolTip="Previous Item" />

                            <Button Margin="16,0,0,0"
                                    materialDesign:RippleAssist.Feedback="{Binding RelativeSource={RelativeSource Self}, Path=Foreground, Converter={StaticResource BrushRoundConverter}}"
                                    Command="{Binding MoveNextCommand}"
                                    Content="{materialDesign:PackIcon Kind=ArrowRight,
                                                        Size=24}"
                                    Foreground="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"
                                    Style="{StaticResource MaterialDesignToolButton}"
                                    ToolTip="Next Item" />


                            <TextBlock Margin="25,0,0,0"
                                       HorizontalAlignment="Center"
                                       VerticalAlignment="Center"
                                       AutomationProperties.Name="Material Design In XAML Toolkit"
                                       FontSize="22"
                                       Text="笔记本" />
                        </StackPanel>

                        <StackPanel Orientation="Horizontal"
                                    DockPanel.Dock="Right">
                            <Image Width="25"
                                   Height="25"
                                   Source="/static/img/User/icon.png">
                                <Image.Clip>
                                    <EllipseGeometry Center="12.5,12.5"
                                                     RadiusX="12.5"
                                                     RadiusY="12.5" />
                                </Image.Clip>
                            </Image>
                            <Button x:Name="minBtn"
                                    Content="一"
                                    Style="{StaticResource MaterialDesignFlatMidBgButton}" />
                            <Button x:Name="maxBtn"
                                    Content="口"
                                    Style="{StaticResource MaterialDesignFlatMidBgButton}" />
                            <Button x:Name="closeBtn"
                                    Content="X"
                                    Style="{StaticResource MaterialDesignFlatMidBgButton}" />
                        </StackPanel>



                    </DockPanel>
                </materialDesign:ColorZone>

            </DockPanel>
        </materialDesign:DrawerHost>
    </materialDesign:DialogHost>
</Window>

MainViewModel文件，添加View文件上下文

using MyToDo.Common.Models;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace MyToDo.ViewModels
{
    public class MainViewModel : BindableBase//继承BindableBase可以动态更新
    {
        public MainViewModel()
        {
            MenuBars = new ObservableCollection<MenuBar>();
            CreateMenuBar();
        }

        private ObservableCollection<MenuBar> menuBars;

        public ObservableCollection<MenuBar> MenuBars
        {
            get { return menuBars; }
            set { menuBars= value; RaisePropertyChanged(); }
        } //动态更新列表

        void CreateMenuBar()
        {
            MenuBars.Add(new MenuBar { Icon = "Home", Title = "首页", NameSpace = "IndexView" });
            MenuBars.Add(new MenuBar { Icon = "Notebook", Title = "代办事项", NameSpace = "ToDoView" });
            MenuBars.Add(new MenuBar { Icon = "NotebookEdit", Title = "备忘录", NameSpace = "MemoView" });
            MenuBars.Add(new MenuBar { Icon = "CogOutline", Title = "设置", NameSpace = "SettingView" });
        }
    }
}

PS:为什么要有private menuBars 和 public MenuBars
在这里插入图片描述

        public ObservableCollection<MenuBar> MenuBars
        {
            get { return MenuBars; }//这里会报错
            set { MenuBars = value; RaisePropertyChanged(); }
        } //动态更新列表


        private ObservableCollection<MenuBar> menuBars;
        public ObservableCollection<MenuBar> MenuBars
        {
            get { return menuBars; }
            set { menuBars= value; RaisePropertyChanged(); }
        } //动态更新列表

删除原来的MainWindow文件

在App.xmal里面修改启动窗口

 public partial class App : PrismApplication
    {
        /// <summary>
        /// 重写运行主窗口
        /// </summary>
        /// <returns></returns>
        /// <exception cref="NotImplementedException"></exception>
        protected override Window CreateShell()
        {
            //重定向主窗口
            - return Container.Resolve<MainWindow>();
            + return Container.Resolve<MainView>();
            
        }

        /// <summary>
        /// 依赖注入
        /// </summary>
        /// <param name="containerRegistry"></param>
        protected override void RegisterTypes(IContainerRegistry containerRegistry)
        {
           
        }
    }

将元素添加到MainView页面
绑定数据上下文：{Binding 属性名}

注意：Views文件夹和ViewModels文件夹必须这样命名，启用Prism的自动联系上下文功能，并且对应文件名为MainView和MainViewModels

在这里插入图片描述

prism启动上下文功能：

xmlns:prism="http://prismlibrary.com/"
prism:ViewModelLocator.AutoWireViewModel="True"

<materialDesign:DrawerHost IsLeftDrawerOpen="{Binding ElementName=MenuToggleButton, Path=IsChecked}">
            <materialDesign:DrawerHost.LeftDrawerContent>
                <DockPanel MinWidth="220">
                    <StackPanel>
                        <Image Width="50"
                               Height="50"
                               Source="/static/img/User/icon.png">
                            <Image.Clip>
                                <EllipseGeometry Center="25,25"
                                                 RadiusX="25"
                                                 RadiusY="25" />
                            </Image.Clip>
                        </Image>
                        <TextBlock  Text="Gclove2000"
                                    HorizontalAlignment="Center"
                                    />

                        <ListBox ItemsSource="{Binding MenuBars}" >
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal">
                                        <materialDesign:PackIcon Kind="{Binding Icon}" />
                                        <TextBlock Text="{Binding Title}" Margin="10,0"/>
                                    </StackPanel>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </StackPanel>
                </DockPanel>
            </materialDesign:DrawerHost.LeftDrawerContent>

运行效果：
在这里插入图片描述

修改MaterialDesign 的默认主题

在App.xmal文件中修改为黑色主题

在这里插入图片描述

<prism:PrismApplication x:Class="MyToDo.App"
                        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                        xmlns:local="clr-namespace:MyToDo"
                        xmlns:prism="http://prismlibrary.com/"
                        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <materialDesign:
                - BundledTheme BaseTheme="Light"
                + BundledTheme BaseTheme="Dark"
                                             PrimaryColor="DeepPurple"
                                             SecondaryColor="Lime" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</prism:PrismApplication>

在这里插入图片描述

如何添加自定义样式

在App.xmal文件中添加样式信息

<prism:PrismApplication x:Class="MyToDo.App"
                        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                        xmlns:local="clr-namespace:MyToDo"
                        xmlns:prism="http://prismlibrary.com/"
                        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <materialDesign:BundledTheme BaseTheme="Dark"
                                             PrimaryColor="DeepPurple"
                                             SecondaryColor="Lime" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
            </ResourceDictionary.MergedDictionaries>
            <!--自定义样式 样式名:MyListBoxItemStyle,样式挂载：ListBoxItem-->
            <Style x:Key="MyListBoxItemStyle" TargetType="ListBoxItem">
                <!--自定义高度-->
                <Setter Property="MinHeight"
                        Value="40" />
                <Setter Property="Template">
                    <Setter.Value>
                        <!--影响属性 ListBoxItem-->
                        <ControlTemplate TargetType="{x:Type ListBoxItem}">
                            <Grid>
                                <Border x:Name="borderHeader" />
                                <Border x:Name="border" />
                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                                                  VerticalAlignment="{TemplateBinding VerticalAlignment}"/>
                            </Grid>
                            
                            <!--触发器-->
                            <ControlTemplate.Triggers>
                                <!--ListBoxItem点击时触发-->
                                <Trigger Property="IsSelected" Value="True">
                                    <Setter Property="BorderThickness"
                                            TargetName="borderHeader"  Value="4,0,0,0"/>
                                    <Setter Property="BorderBrush"
                                            TargetName="borderHeader"
                                            Value="{DynamicResource PrimaryHueLightBrush}" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </Application.Resources>
</prism:PrismApplication>

在对应元素中引用样式

<ListBox ItemsSource="{Binding MenuBars}" 
+ ItemContainerStyle="{StaticResource MyListBoxItemStyle}" >
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal">
                                        <materialDesign:PackIcon Kind="{Binding Icon}" Margin="15,0" />
                                        <TextBlock Text="{Binding Title}" Margin="10,0"/>
                                    </StackPanel>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>

实现效果：有点丑，可以后面改一下
在这里插入图片描述

设置点击范围

在这里插入图片描述

<StackPanel Orientation="Horizontal"
            VerticalAlignment="Center"
            + Background="Transparent">没设置为蓝色点击范围，设置了为红色点击范围
    <materialDesign:PackIcon Kind="{Binding Icon}"
                             Margin="15,0" />
    <TextBlock Text="{Binding Title}"
               Margin="10,0" />
</StackPanel>

设置鼠标悬停效果

也是设置触发器
App.xmal

<!--自定义样式 样式名:MyListBoxItemStyle,样式挂载：ListBoxItem-->
<Style x:Key="MyListBoxItemStyle" TargetType="ListBoxItem">
   <!--自定义高度-->
   <Setter Property="MinHeight"
           Value="40" />
   <Setter Property="Template">
       <Setter.Value>
           <!--影响属性 ListBoxItem-->
           <ControlTemplate TargetType="{x:Type ListBoxItem}">
               <Grid>
                   <Border x:Name="borderHeader" />
                   <Border x:Name="border" />
                   <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                                     VerticalAlignment="{TemplateBinding VerticalAlignment}"/>
               </Grid>
               
               <!--触发器-->
               <ControlTemplate.Triggers>
                   <!--ListBoxItem点击时触发-->
                   <Trigger Property="IsSelected" Value="True">
                       <Setter Property="BorderThickness"
                               TargetName="borderHeader"  Value="4,0,0,0"/>
                       <Setter Property="BorderBrush"
                               TargetName="borderHeader"
                               Value="{DynamicResource PrimaryHueLightBrush}" />
                       <Setter TargetName="border"
                               Property="Background"
                               Value="{DynamicResource PrimaryHueLightBrush}" />
                       <Setter TargetName="border"
                               Property="Opacity"
                               Value="0.4" />
                   </Trigger>
                   <!--鼠标悬停触发器触发器-->
                   + <Trigger Property="IsMouseOver" Value="True">
                   +    <Setter TargetName="border"
                   +            Property="Background"
                   +            Value="{DynamicResource PrimaryHueLightBrush}" />
                   +    <Setter TargetName="border"
                   +            Property="Opacity"
                   +            Value="0.4" />
                   + </Trigger>
               </ControlTemplate.Triggers>
           </ControlTemplate>
       </Setter.Value>
   </Setter>
</Style>

最终效果：

在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

基于MWORKS的电动汽车电平衡分析

基于MWORKS的电动汽车电平衡分析

1 引言 随着电动汽车的快速发展、电池技术的进步和智能电力管理系统的应用&#xff0c;电动汽车电平衡已经成为了电动汽车技术研究中的重要问题之一。 电动汽车电平衡是指车辆发电机、蓄电池、整车用电器在一定时间内的电能供给与消耗达到平衡状态。如果车辆电能产生与消耗无法…
阅读更多...
国产游戏引擎，竟然用来搞民航

国产游戏引擎，竟然用来搞民航

​本文源自量子位 | 公众号 QbitAI 只是给飞行员做个“装备”&#xff0c;竟然突破了国内民用航空领域的一大技术难题&#xff1f;&#xff01; 这是一群游戏技术开发者的真实经历。 他们用自研游戏引擎开发了一个飞行模拟软件&#xff0c;能够第一视角模拟飞行员起飞、着陆…
阅读更多...
mysql 分组语句测试

mysql 分组语句测试

建表 建表语句&#xff1a; CREATE TABLE student( id int not null, name char(12), sex char(1) ); 预置数据 insert into student values(1, wh, 1); insert into student values(2, wh1, 0); insert into student values(3, zyx, 0); commit; 增加字段 alt…
阅读更多...
Linux -- 进程信号

Linux -- 进程信号

文章目录 1. 信号量1.1 进程互斥概念1.2 认识信号量 2. 信号入门2.1 信号概念2.2 见一见2.3 signal()系统调用2.4 宏定义信号 3. 信号产生方式3.1 键盘产生信号3.2 系统调用产生信号3.3 软件条件产生信号3.4 硬件异常产生信号3.5 Core dump 4. 阻塞信号4.1 相关概念4.2 信号在内…
阅读更多...
1066 Root of AVL Tree（51行代码+超详细注释）

1066 Root of AVL Tree（51行代码+超详细注释）

分数 25 全屏浏览题目 切换布局 作者 CHEN, Yue 单位 浙江大学 An AVL tree is a self-balancing binary search tree. In an AVL tree, the heights of the two child subtrees of any node differ by at most one; if at any time they differ by more than one, rebala…
阅读更多...
马斯克们叫停 GPT-5，更像是场行为艺术

马斯克们叫停 GPT-5，更像是场行为艺术

目录 01 联名信说了什么&#xff1f; 02 发起方是谁&#xff1f; 03 谁签署了联名信&#xff1f; 04 联名信有哪些问题&#xff1f;三巨头的另外两位 Sam Altman 的表态 其他值得关注的署名者 比如马斯克。 另一个位于前列的署名者是 Stability AI 的创始人 Emad Most…
阅读更多...
MySQL---存储函数、触发器

MySQL---存储函数、触发器

1. 存储函数 MySQL存储函数&#xff08;自定义函数&#xff09;&#xff0c;函数一般用于计算和返回一个值&#xff0c;可以将经常需要使用的计算 或功能写成一个函数。 存储函数和存储过程一样&#xff0c;都是在数据库中定义一些 SQL 语句的集合。 存储函数与存储过程的区…
阅读更多...
初识kubernetes

初识kubernetes

初识kubernetes 1.应用部署方式演变 在部署应用程序的方式上&#xff0c;主要经历了三个时代&#xff1a; 传统部署&#xff1a;互联网早期&#xff0c;会直接将应用程序部署在物理机上 优点&#xff1a;简单&#xff0c;不需要其它技术的参与缺点&#xff1a;不能为应用程…
阅读更多...
MySQL基础-事务详解

MySQL基础-事务详解

本文主要介绍MySQL事务 文章目录 前言事务定义事务四大特性&#xff08;ACID&#xff09; 事务操作事务并发问题事务隔离级别 前言 参考链接&#xff1a; 链接1链接2 事务定义 事务是一组操作的集合&#xff0c;他是一个不可分割的工作单位&#xff0c;事务会把所有的操作作…
阅读更多...
二叉树总结

二叉树总结

文章目录 树需要掌握的基本概念二叉树基本特点满二叉树性质 完全二叉树性质 二叉搜索树&#xff08;二叉排序树&#xff09;Binary Search Tree(BST)性质 平衡二叉树性质 红黑树五大性质 B树 二叉树的存储方式链式存储顺序存储 二叉树的遍历 树需要掌握的基本概念 1、节点、根…
阅读更多...
Java版spring cloud 本工程项目管理系统源码-全面的工程项目管理

Java版spring cloud 本工程项目管理系统源码-全面的工程项目管理

​ ​工程项目管理系统是指从事工程项目管理的企业&#xff08;以下简称工程项目管理企业&#xff09;受业主委托&#xff0c;按照合同约定&#xff0c;代表业主对工程项目的组织实施进行全过程或若干阶段的管理和服务。 如今建筑行业竞争激烈&#xff0c;内卷严重&#xff0c…
阅读更多...
接口自动化测试神器：Python+Requests+Unittest让你的测试用例飞起来

接口自动化测试神器：Python+Requests+Unittest让你的测试用例飞起来

B站首推&#xff01;2023最详细自动化测试合集&#xff0c;小白皆可掌握&#xff0c;让测试变得简单、快捷、可靠 随着互联网的发展&#xff0c;越来越多的应用程序采用了分布式架构&#xff0c;并通过API接口进行数据交换。因此&#xff0c;接口自动化测试已经成为了保证软件质…
阅读更多...
【探索SpringCloud】服务发现

【探索SpringCloud】服务发现

前言 今天&#xff0c;我们来聊聊SpringCloud服务发现。主要有如下几个议题&#xff1a; 一、服务发现的概念与方案&#xff1b;二、SpringCloud是如何与各个服务注册厂商进行集成的。 服务发现 在微服务架构中&#xff0c;我们不可避免的需要通过服务间的调用来完成系统功能…
阅读更多...
蓝牙网状网络的基本原理及应用开发

蓝牙网状网络的基本原理及应用开发

借助蓝牙 5 的网状网络功能&#xff0c;开发人员可以增强无线连接系统&#xff08;如物联网设备&#xff09;的通信范围和网络可用性。但是&#xff0c;网状网络的低功耗无线硬件设计与网状网络软件开发之间存在着复杂的层次&#xff0c;这可能会使开发人员迅速陷入混乱并危及项…
阅读更多...
今年的面试难度有点大....

今年的面试难度有点大....

大家好&#xff0c;最近有不少小伙伴在后台留言&#xff0c;又得准备面试了&#xff0c;不知道从何下手&#xff01; 不论是跳槽涨薪&#xff0c;还是学习提升&#xff01;先给自己定一个小目标&#xff0c;然后再朝着目标去努力就完事儿了&#xff01; 为了帮大家节约时间&a…
阅读更多...
Windows Cygwin 配置

Windows Cygwin 配置

Windows Cygwin 配置 一、什么是Cygwin&#xff1f; Cygwin&#xff0c;原Cygnus出品&#xff08;已被红帽收购&#xff09;&#xff0c;目前是RedHat名下的项目。项目的目的是提供运行于 Windows 平台的类 Unix 环境&#xff08;以 GNU 工具为代表&#xff09;。为了达到这个…
阅读更多...
一天吃透SpringCloud面试八股文

一天吃透SpringCloud面试八股文

1、什么是Spring Cloud &#xff1f; Spring cloud 流应用程序启动器是基于 Spring Boot 的 Spring 集成应用程序&#xff0c;提供与外部系统的集成。Spring cloud Task&#xff0c;一个生命周期短暂的微服务框架&#xff0c;用于快速构建执行有限数据处理的应用程序。 Sprin…
阅读更多...
前端｜想到什么写什么

前端｜想到什么写什么

记录当初伤害过我的一些概念&#x1f60a; 文章目录 一、闭包二、深拷贝、浅拷贝三、slice、splice、join、split、filter、concat、sort、some、every四、for in和for of、 map和foreach五、原型和原型链六、跨域七、vue相关1、生命周期2、响应式原理3、watch和computed4、vu…
阅读更多...
协程切换原理与实践 -- 从ucontext api到x86_64汇编

协程切换原理与实践 -- 从ucontext api到x86_64汇编

目录 1.协程切换原理理解 2.ucontext实现协程切换 2.1 实现流程 2.2 根据ucontext流程看协程实现 2.3 回答开头提出的问题 3.x86_64汇编实现协程切换 3.1libco x86_64汇编代码分析 3.2.保存程序返回代码地址流程 3.3.恢复程序地址以及上下文 4.实现简单协程框架 1.协程…
阅读更多...
MySQL 中 CONCAT 函数使用

MySQL 中 CONCAT 函数使用

1&#xff1a;创建数据表&#xff1a; CREATE TABLE user ( id int NOT NULL AUTO_INCREMENT, code varchar(255) NOT NULL, name varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL, PRIMARY KEY (id) ) ENGINEInnoDB AUTO_INCREMENT3 DE…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站