WPF -- LiveCharts的使用和源码

LiveCharts 是一个开源的 .NET 图表库,特别适用于 WPF、WinForms 和其他 .NET 平台。它提供了丰富的图表类型和功能,使开发者能够轻松地在应用程序中创建动态和交互式图表。下面我将使用WPF平台创建一个测试实例。

一、LiveCharts的安装和使用

1.安装NuGet程序包

  • 右键项目,点击管理 NuGet程序包

  • 搜索LiveCharts并安装LiveCharts.WPF程序包

2.LiveCharts的功能

博主讲解了多种图表的使用:

WPF—LiveCharts图表_wpf livecharts-CSDN博客

  1. 折线图 (Line Chart)
  2. 柱状图 (Column Chart)
  3. 条形图 (Bar Chart)
  4. 面积图 (Area Chart)
  5. 圆饼图 (Pie Chart)
  6. 雷达图 (Radar Chart)
  7. 散点图 (Scatter Chart)
  8. 组合图 (Combination Chart)
  9. K线图 (Candlestick Chart)
  10. 子图 (Subcharts)

其他功能

  • 动态图表: 支持实时数据更新。
  • 动画效果: 提供平滑的过渡动画。
  • 自定义样式: 可以根据需求自定义颜色、样式和标签格式。
  • 交互功能: 支持缩放、平移等用户交互。

二、折线图实例

注意:在本过程中我使用了 CommunityToolkit 程序包,通过它直接使用了MVVM模式架构(安装如下图的程序安装包即可)。

文件夹

1.ViewModel.cs

下面代码已加详细的注释。

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using LiveCharts;
using LiveCharts.Wpf;
using System.Timers;
using System.Windows.Media;

namespace LiveCharts实验.ViewModels
{
    public partial class 折线图ViewModel : ObservableObject
    {
        #region 属性声明
        public SeriesCollection LineSeriesCollection { get; set; } //SeriesCollection 是 LiveCharts 提供的类,用于存放多个数据系列
        public Func<double, string> CustomFormatterX { get; set; } //格式化 X 轴的标签。可以自定义显示的格式
        public Func<double, string> CustomFormatterY { get; set; } //格式化 Y 轴的标签。可以自定义显示的格式

        private double axisXMax;
        public double AxisXMax //X轴的最大显示范围
        {
            get { return axisXMax; }
            set { axisXMax = value; this.OnPropertyChanged("AxisXMax"); }
        }

        private double axisXMin;
        public double AxisXMin //X轴的最小值
        {
            get { return axisXMin; }
            set { axisXMin = value; this.OnPropertyChanged("AxisXMin"); }
        }

        private double axisYMax;
        public double AxisYMax //Y轴的最大显示范围
        {
            get { return axisYMax; }
            set
            {
                axisYMax = value;
                this.OnPropertyChanged("AxisYMax");
            }
        }
        private double axisYMin;
        public double AxisYMin //Y轴的最小值
        {
            get { return axisYMin; }
            set 
            { 
                axisYMin = value; 
                this.OnPropertyChanged("AxisYMin");
            }
        }

        private System.Timers.Timer timer = new System.Timers.Timer(); //声明一个定时器实例
        private Random Randoms = new Random(); //随机数生成器
        private int TabelShowCount = 10; //表示在图表中显示的最大点数   
        private List<ChartValues<double>> ValueLists { get; set; } //存储 Y 轴的数据点
        private List<Axis> YAxes { get; set; } = new List<Axis>();

        private string CustomFormattersX(double val) //格式化 X 轴的标签
        {
            return string.Format("{0}", val); //可以初始化为时间等
        }

        private string CustomFormattersY(double val) //格式化  Y 轴的标签
        {
            return string.Format("{0}", val);
        }
        #endregion

        public 折线图ViewModel()
        {
            AxisXMax = 10; //初始化X轴的最大值为10
            AxisXMin = 0; //初始化X轴的最小值为0
            AxisYMax = 10; //初始化Y轴的最大值为10
            AxisYMin = 0; //初始化Y轴的最小值为0

            ValueLists = new List<ChartValues<double>> // 初始化六个数据曲线的值集合
        {
            new ChartValues<double>(),
            new ChartValues<double>(),
            new ChartValues<double>(),
            new ChartValues<double>(),
            new ChartValues<double>(),
            new ChartValues<double>()
        };
            LineSeriesCollection = new SeriesCollection(); //创造LineSeriesCollection的实例

            CustomFormatterX = CustomFormattersX; //设置X轴自定义格式化函数
            CustomFormatterY = CustomFormattersY; //设置Y轴自定义格式化函数

            var colors = new[] //初始化一个颜色数组供线条颜色使用
            {
                Brushes.Red,
                Brushes.Green,
                Brushes.Blue,
                Brushes.Orange,
                Brushes.Purple,
                Brushes.Teal
            };

            for (int i = 0; i < 6; i++) // 创建六个 LineSeries 并添加到LineSeriesCollection集合中
            {
                LineSeries lineseries = new LineSeries
                {
                    Title = $"曲线 {i + 1}", // 设置曲线名称
                    DataLabels = false, // 数据标签不可见
                    Values = ValueLists[i], // Y 轴数值绑定到相应的 ValueList
                    StrokeThickness = 3, // 设置线条的宽度
                    PointGeometrySize = 8, // 设置数据点的大小
                    LineSmoothness = 0.5, // 设置折线的弯折度 (0: 直线, 1: 完全平滑)
                    Stroke = colors[i % colors.Length], // 设置每条曲线的颜色
                    Fill = Brushes.Transparent // 去掉阴影
                };
                LineSeriesCollection.Add(lineseries); // 添加到 LineSeriesCollection 中
            }

            timer.Interval = 1000; //设置定时器间隔为1000毫秒,即1秒触发一次定时器订阅的事件
            timer.Enabled = false; //定时器初始未打开,需要手动打开
            timer.Elapsed += 打开定时器了; //定时器打开订阅的事件
            AppDomain.CurrentDomain.ProcessExit += OnProcessExit; //定时器关闭订阅的事件
        }

        [RelayCommand]
        private void 添加数据()
        {
            for (int i = 0; i < ValueLists.Count; i++)  // 为每条曲线生成一个随机的 Y 值并添加
            {
                int yValue = Randoms.Next(2, 1000); // 生成随机数
                ValueLists[i].Add(yValue); // 向对应的曲线添加数据
            }

            int maxY = (int)ValueLists.Select(v => v.Max()).Max(); // 获取所有曲线的最大值
            AxisYMax = maxY + 30; // 将 Y 轴的最大值设置为这个最大值加上 30

            if (ValueLists[0].Count > TabelShowCount) // 仅检查第一条曲线的数据点数量
            {
                AxisXMax = ValueLists[0].Count - 1; // X 轴最大值
                AxisXMin = ValueLists[0].Count - TabelShowCount; // X 轴最小值
            }
        }

        [RelayCommand]
        private void 定时添加数据()
        {
            if (timer.Enabled == false) //判断定时器是否是打开状态,如果没有打开就打开定时器添加数据;
            {
                timer.Start();
            }   
            else
            {
                timer.Stop(); //如果已经打开定时器,那么这次点击按钮就是关闭定时器,停止添加数据
                timer.Dispose();
            }
        }

        private void 打开定时器了(object sender, ElapsedEventArgs e) //定时器打开后订阅的事件
        {
            for (int i = 0; i < ValueLists.Count; i++)  // 为每条曲线生成一个随机的 Y 值并添加
            {
                int yValue = Randoms.Next(2, 1000); // 生成随机数
                ValueLists[i].Add(yValue); // 向对应的曲线添加数据
            }

            int maxY = (int)ValueLists.Select(v => v.Max()).Max(); // 获取所有曲线的最大值
            AxisYMax = maxY + 30; // 将 Y 轴的最大值设置为这个最大值加上 30

            if (ValueLists[0].Count > TabelShowCount) // 仅检查第一条曲线的数据点数量
            {
                AxisXMax = ValueLists[0].Count - 1; // X 轴最大值
                AxisXMin = ValueLists[0].Count - TabelShowCount; // X 轴最小值
            }
        }

        private void OnProcessExit(object? sender, EventArgs e) //进程退出时订阅的事件
        {
            try
            {
                timer.Stop(); //关闭定时器
                timer.Dispose(); //释放资源
            }
            catch { }
        }
    }
}

2.View.xaml.cs

using LiveCharts实验.ViewModels;
using System.Windows;

namespace LiveCharts实验.Views
{
    public partial class 折线图View : Window
    {
        private 折线图ViewModel ViewModel = new 折线图ViewModel();

        public 折线图View()
        {
            InitializeComponent();
            DataContext = ViewModel;
        }
    }
}

3.View.xaml

<Window x:Class="LiveCharts实验.Views.折线图View"
        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:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
        xmlns:local="clr-namespace:LiveCharts实验.Views"
        mc:Ignorable="d"
        Title="折线图View" 
        Width="1700" 
        Height="1400">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Grid Grid.Row="0" 
              Background="AntiqueWhite">
            <Button Content="测试" 
                    Margin="0,10,0,0" 
                    HorizontalAlignment="Left" 
                    VerticalAlignment="Top" 
                    Width="75"
                    Command="{Binding 添加数据Command}"/>

            <Button Content="定时添加数据" 
                    Margin="80,10,0,0" 
                    HorizontalAlignment="Left" 
                    VerticalAlignment="Top" 
                    Width="95"
                    Command="{Binding 定时添加数据Command}" />
        </Grid>
        
        <Grid Grid.Row="1">
            <lvc:CartesianChart Series="{Binding LineSeriesCollection}" 
                                LegendLocation="Right" 
                                AnimationsSpeed="00:00:00.500"
                                Zoom ="Xy"
                                Pan="X">
                <lvc:CartesianChart.AxisX>
                    <lvc:Axis LabelFormatter="{Binding CustomFormatterX}" 
                              MaxValue="{Binding AxisXMax}" 
                              MinValue="{Binding AxisXMin}">
                        <lvc:Axis.Separator>
                            <lvc:Separator Step="1" />
                        </lvc:Axis.Separator>
                    </lvc:Axis>
                </lvc:CartesianChart.AxisX>

                <lvc:CartesianChart.AxisY>
                    <lvc:Axis Foreground="red"
                              MaxValue="{Binding AxisYMax}" 
                              MinValue="{Binding AxisYMin}">
                    </lvc:Axis>

                    <lvc:Axis Foreground="Green"
                              MaxValue="{Binding AxisYMax}" 
                              MinValue="{Binding AxisYMin}">
                    </lvc:Axis>

                    <lvc:Axis Foreground="Blue"
                              MaxValue="{Binding AxisYMax}" 
                              MinValue="{Binding AxisYMin}">
                    </lvc:Axis>

                    <lvc:Axis Foreground="Orange"
                              Position="RightTop"
                              MaxValue="{Binding AxisYMax}" 
                              MinValue="{Binding AxisYMin}">
                    </lvc:Axis>

                    <lvc:Axis Foreground="Purple"
                              Position="RightTop"
                              MaxValue="{Binding AxisYMax}" 
                              MinValue="{Binding AxisYMin}">
                    </lvc:Axis>

                    <lvc:Axis Foreground="Teal"
                              Position="RightTop"
                              MaxValue="{Binding AxisYMax}" 
                              MinValue="{Binding AxisYMin}">
                    </lvc:Axis>
                </lvc:CartesianChart.AxisY>
            </lvc:CartesianChart>
        </Grid>
    </Grid>
</Window>

解释:

<lvc:CartesianChart>: 创建了一个二维 Cartesian 图表。

  • Series="{Binding LineSeriesCollection}": 绑定图表的数据系列集合到 LineSeriesCollection。这个集合在 ViewModel 中定义。
  • LegendLocation="Right": 指定图例的位置在右侧。
  • AnimationsSpeed="00:00:00.500":动画的速度。
  • DrawMargin="{Binding ChartMargin}":图表边距(代码中无)
  • Zoom="Xy": 允许用户在 X 和 Y 轴上进行缩放。
  • Pan="X": 允许用户在 X 轴上拖动(平移)。

<lvc:CartesianChart.AxisX>: 定义 X 轴的属性。

  • LabelFormatter="{Binding CustomFormatterX}": 绑定 X 轴标签格式化函数到 CustomFormatterX,用于自定义标签的显示格式(例如:显示为“天”)。
  • MaxValue="{Binding AxisXMax}"MinValue="{Binding AxisXMin}": 绑定 X 轴的最大和最小值,以动态控制显示范围。
  • <lvc:Axis.Separator>: 定义网格线的分隔符。
    • <lvc:Separator Step="1" />: 设置网格线的间隔为 1。

<lvc:CartesianChart.AxisY>: 定义 Y 轴的属性。

  • 多个 <lvc:Axis> 元素: 你定义了多个 Y 轴,分别为红色、绿色、蓝色、橙色、紫色和青色。每条曲线使用不同的 Y 轴,这通常用于不同数据范围的曲线。
  • Foreground 属性: 设置 Y 轴标签和网格线的颜色。
  • Position 属性: 设置了部分 Y 轴在右上角。这个属性用于控制 Y 轴的位置(默认是在左侧)。

在此处多个Y轴应该与使用中的数据绑定好。

4.实验结果

4.1.通过按钮添加曲线数据集单个数据

4.2.定时添加多个数据并动态显示

三、柱状图实例

1.ViewModel.cs

using LiveCharts.Wpf;
using LiveCharts;
using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;

namespace LiveCharts实验.ViewModels
{
    public partial class 柱状图ViewModel : ObservableObject
    {
        #region 属性声明
        private SeriesCollection _columnValues;
        public SeriesCollection ColumnValues
        {
            get { return _columnValues; }
            set
            {
                _columnValues = value;
                OnPropertyChanged(nameof(ColumnValues));
            }
        }

        private string[] _axisXLabels = { "A", "B", "C", "D" };
        public string[] AxisXLabels
        {
            get { return _axisXLabels; }
        }

        private Random 随机索引 = new Random(); //随机数生成器
        private Random Randoms = new Random(); //随机数生成器
        #endregion

        public 柱状图ViewModel()
        {
            ColumnValues = new SeriesCollection // 初始化时创建柱状图数据
        {
            new ColumnSeries
            {
                Title = "数据集 1",
                Values = new ChartValues<double> { 0, 1, 2, 3 }
            },
            new ColumnSeries
            {
                Title = "数据集 2",
                Values = new ChartValues<double> { 4, 5, 6, 7 }
            },
            new ColumnSeries
            {
                Title = "数据集 3",
                Values = new ChartValues<double> { 8, 9, 10, 11 }
            }
        };
        }

        public void UpdateData(int index, int datasetIndex, double value) // 更新某个横坐标某个数据集的数据
        {
            if (index < 0 || index >= _axisXLabels.Length)
                throw new ArgumentOutOfRangeException(nameof(index), "索引超出范围");

            if (datasetIndex < 0 || datasetIndex >= ColumnValues.Count)
                throw new ArgumentOutOfRangeException(nameof(datasetIndex), "数据集索引超出范围");

            ColumnValues[datasetIndex].Values[index] = value; // 更新指定横坐标和数据集的数据
            OnPropertyChanged(nameof(ColumnValues)); // 通知数据已更新
        }

        [RelayCommand]
        private void 添加数据() //点击按键之后向随机索引的某一个数据添加一个随机数
        {
            UpdateData(随机索引.Next(0,4), 随机索引.Next(0,2), Randoms.Next(0,999));
        }
    }
}

2.View.xaml.cs

using LiveCharts实验.ViewModels;
using System.Windows;

namespace LiveCharts实验.Views
{

    public partial class 柱状图View : Window
    {
        private 柱状图ViewModel viewModel = new 柱状图ViewModel();
        public 柱状图View()
        {
            InitializeComponent();
            DataContext = viewModel;
        }
    }
}

3.View.xaml

<Window x:Class="LiveCharts实验.Views.柱状图View"
        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:lv="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
        xmlns:local="clr-namespace:LiveCharts实验.Views"
        mc:Ignorable="d"
        Title="柱状图View" 
        Height="1450" 
        Width="1600">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Button Content="添加数据" 
                Margin="80,10,0,0" 
                HorizontalAlignment="Left" 
                VerticalAlignment="Top" 
                Width="95"
                Command="{Binding 添加数据Command}" />

        <lv:CartesianChart Series="{Binding ColumnValues}" 
                           Grid.Row="1"
                           LegendLocation="Right">
            <lv:CartesianChart.AxisX>
                <lv:Axis Title="类别" 
                         Labels="{Binding AxisXLabels}"/>
            </lv:CartesianChart.AxisX>
            <lv:CartesianChart.AxisY>
                <lv:Axis Title="值"/>
            </lv:CartesianChart.AxisY>
        </lv:CartesianChart>
    </Grid>
</Window>

4.实验结果

添加随机数后。

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

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

相关文章

网盘直链下载神器NDM

工具介绍 ​Neat Download Manager分享一款网盘不限速神器,安装步骤稍微有一点繁琐,但实际体验下载速度飞快,个人实际体验还是非常不错的 NDM是一款免费且强大的下载工具。可以帮助你下载各种文件&#xff0c;还能够在多任务下载中保持出色的速度及其稳定性 通过网盘分享的文…

五年三次冲刺IPO失败,企业业绩成长性恐不足,三年分红约1.5亿元

中超股份终止原因如下&#xff1a;首先&#xff0c;报告期&#xff0c;中超股份营收和净利润增幅出现下降趋势&#xff0c;公司业绩规模成长性恐不足。其次&#xff0c;公司货币资金较为紧张情况下&#xff0c;仍在报告期内连续三年分红&#xff0c;累计1.46亿元&#xff0c;募…

Java爬虫:获取直播带货数据的实战指南

在当今数字化时代&#xff0c;直播带货已成为电商领域的新热点&#xff0c;通过直播平台展示商品并进行销售&#xff0c;有效促进了产品的曝光和销售量的提升。然而&#xff0c;如何在直播带货过程中进行数据分析和评估效果&#xff0c;成为了摆在商家面前的一个重要问题。本文…

边缘计算技术的优势与挑战

如今&#xff0c;随着5G快速无线网络的到来&#xff0c;将计算存储和物联网&#xff08;IoT&#xff09;分析的部署放在靠近数据产生的地方&#xff0c;使得边缘计算成为可能。 物联网设备和新应用的扩展需要实时计算能力。5G无线正在考虑边缘系统&#xff0c;以快速跟踪支持实…

016集——c# 实现CAD类库 与窗体的交互(CAD—C#二次开发入门)

第一步&#xff1a;搭建CAD类库dll开发环境。 第二步&#xff1a;添加窗体 第三步&#xff1a;添加控件 第四步&#xff1a;双击控件&#xff0c;在控件点击方法内输入代码 第五步&#xff1a;在主程序内实例化新建的form类&#xff0c;并弹窗form窗体 第六步&#xff1a;CAD命…

1.2.3 TCP IP模型

TCP/IP模型&#xff08;接网叔用&#xff09; 网络接口层 网络层 传输层 应用层 理念&#xff1a;如果某些应用需要“数据格式转换”“会话管理功能”&#xff0c;就交给应用层的特定协议去实现 tip&#xff1a;数据 局部正确不等于全局正确 但是&#xff0c;数据的 全局正…

Codeforces Round 770 (Div. 2)

比赛链接&#xff1a;Dashboard - Codeforces Round 770 (Div. 2) - Codeforces A. Reverse and Concatenate 题意&#xff1a; 思路&#xff1a; 假设 s "abba" 经过1次操作后 -> "abbaabba" s "abcd" 经过一次操作后 -> "abcd…

EditPlus的安装软件包

解压并粘贴到C:\Program Files (x86)中 点击激活密匙,并一直同意 确认并选择默认的位置: 关闭并重新激活密匙 就好了 无需添加快捷方式: 只需要选择任意文件 并选择该应用打开一次即可 通过百度网盘分享的文件&#xff1a;EditPlus_5.0.611.zip 链接&#xff1a;https://pa…

Sentinel 快速入门

前置推荐阅读:Sentinel 介绍-CSDN博客 前置推荐阅读&#xff1a;Nacos快速入门-CSDN博客 快速开始 欢迎来到 Sentinel 的世界&#xff01;这篇新手指南将指引您快速入门 Sentinel。 Sentinel 的使用可以分为两个部分: 核心库&#xff08;Java 客户端&#xff09;&#xff1a…

C语言之练习题

欢迎来到我的&#xff1a;世界 希望作者的文章对你有所帮助&#xff0c;有不足的地方还请指正&#xff0c;大家一起学习交流 !&#x1f60a; 目录 内容第一题&#xff1a;加一第二题&#xff1a;移动零第三题 &#xff1a;分发饼干第四题&#xff1a;买股票的最佳时机第五题&a…

php中的错误和异常捕获

目录 一&#xff1a; 异常&#xff08;Exceptions&#xff09; 二&#xff1a; 错误&#xff08;Errors&#xff09; 三&#xff1a;实际项目的异常和错误处理 在PHP中&#xff0c;异常&#xff08;Exceptions&#xff09;和错误&#xff08;Errors&#xff09;是两个不同的…

汇总10个AI免费一键生成PPT的网站

一、前言 PPT幻灯片是现代办公和学习中的重要组成部分。它在工作、研究或培训中扮演着重要角色&#xff0c;并能够让观众更好地理解信息。随着当今人工智能技术的快速发展&#xff0c;现在有很多免费的AI PPT生成器可供选择&#xff0c;帮助用户更加便捷地制作出高效且具有较强…

热门短视频素材资源网站推荐

在制作抖音短视频时&#xff0c;选择高质量的素材至关重要。为了帮助短视频创作者获取高清无水印的视频素材&#xff0c;以下是我为大家推荐的六个优质视频素材网站&#xff0c;赶快来看看吧&#xff01; 蛙学网 首先介绍的是蛙学网&#xff0c;作为国内知名的视频素材平台&…

数据结构:二叉树、堆

目录 一.树的概念 二、二叉树 1.二叉树的概念 2.特殊类型的二叉树 3.二叉树的性质 4.二叉树存储的结构 三、堆 1.堆的概念 2.堆的实现 Heap.h Heap.c 一.树的概念 注意&#xff0c;树的同一层中不能有关联&#xff0c;否侧就不是树了&#xff0c;就变成图了&#xff…

C# 条形码、二维码标签打印程序

1、条码标答打印主界面 2、打印设置 3、生成QR代码 private void GetBarcode_T(string lr) { QRCodeEncoder qrCodeEncoder = new QRCodeEncoder();//创建一个对象 qrCodeEncoder.QRCodeEncodeMode = QRCodeEncoder.ENCODE_MODE.BYTE; //设置编码测量…

汽车票预订系统:SpringBoot技术革新

5系统详细实现 5.1 用户注册 用户需要注册才可以登录。具体界面的展示如图5.1所示。 图5.1 用户注册界面 5.2 汽车票 用户登录后在后台汽车票信息可以进行预定操作。具体界面如图5.2所示。 图5.2 汽车票界面 5.3 订单 用户可以在订单管理里面对订单信息进行换票和支付操作。…

工作日志:vue3各种警告

1、遇见报错&#xff0c;但也没啥影响&#xff0c;不知怎么回事。 可是我没写过这东西啊。 2、一个警告。 它表示在渲染过程中尝试访问组件实例上不存在的属性linkTags。 解决办法&#xff1a;在该属性前&#xff0c;加个v-if判断。 3、 意味着在模板渲染过程中尝试访问了…

MySQL8.0主从同步报ERROR 13121错误解决方法

由于平台虚拟机宿主机迁移&#xff0c;导致一套MySQL主从库从节点故障&#xff0c;从节点服务终止&#xff0c;在服务启动后&#xff0c;恢复从节点同步服务&#xff0c;发现了如下报错&#xff1a; mysql> show slave status\G; *************************** 1. row *****…

前端求职简历-待补充

当然可以&#xff0c;针对大厂的前端岗位&#xff0c;一个吸引人的简历应该突出你的技术能力、项目经验、教育背景以及任何能体现你学习能力和团队协作能力的证明。以下是一个简历大纲示例&#xff0c;你可以根据自己的实际情况进行调整&#xff1a; 个人信息 姓名联系方式&a…

图文深入介绍oracle资源管理(续)

1. 引言&#xff1a; 本文将承接上篇继续深入介绍oracle资源管理。本文重点介绍如何使用oracle资源管理器管理好DB。 2. 资源管理器&#xff1a; 可以使用图形界面 OEM$或命令行调用 DBMS RESOURCE MANAGER 程序包的过程进行数据库资源管理。 调用资源管理器的先决条件&…