为WPF的Grid添加网格边框线

        在WPF中使用Grid绘制表格的时候，如果元素较多、排列复杂的话，界面会看起来很糟糕，没有层次，这时用网格或边框线分割各元素（标签或单元格）将会是页面看起来整齐有条理。

        默认没有边框线的如下图所示：     

<Window x:Class="GridLineTest.MainWindow"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:GridLineTest"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock></Grid>
</Window>

        一、使用ShowGridLines属性

        Grid控件自带属性：ShowGridLines，只需将它设为True即可显示网格线，效果如下：

<Window x:Class="GridLineTest.MainWindow"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:GridLineTest"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400" ShowGridLines="True"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock></Grid>
</Window>

        使用ShowGridLines属性的优点是简单，一般用于Grid内部元素排版使用；缺点有：1、无法变更样式，固定是虚线；2、不随单元格合并而改变；3、不会显示最大的外边框线。

        二、使用Border添加边框线

        适用于行和列较少的情况，不然CV工作量小不了，行号和列号还容易填错。      

<Window x:Class="GridLineTest.MainWindow"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:GridLineTest"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style><Style TargetType="Border"><Setter Property="BorderBrush" Value="Red"></Setter><Setter Property="BorderThickness" Value="1"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock><!--使用Border绘制边框--><Border Grid.Row="0"></Border><Border Grid.Row="1"></Border><Border Grid.Row="2"></Border><Border Grid.Column="0"></Border><Border Grid.Column="1"></Border><Border Grid.Column="2"></Border><Border Grid.Row="1" Grid.Column="1"></Border><Border Grid.Row="1" Grid.Column="2"></Border><Border Grid.Row="2" Grid.Column="1"></Border><Border Grid.Row="2" Grid.Column="2"></Border></Grid>
</Window>

        三、使用附加属性添加边框线

        TextBlock元素本身并没有行和列的概念，但是可以通过Grid.GetColumn和Grid.SetColumn来附加属性，生成Grid布局。

using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;namespace Helper
{public class GridLineHelper{#region 可以通过propa快捷方式生成下面段代码public static bool GetShowBorder(DependencyObject obj){return (bool)obj.GetValue(ShowBorderProperty);}public static void SetShowBorder(DependencyObject obj, bool value){obj.SetValue(ShowBorderProperty, value);}public static readonly DependencyProperty ShowBorderProperty =DependencyProperty.RegisterAttached("ShowBorder", typeof(bool), typeof(GridLineHelper), new PropertyMetadata(OnShowBorderChanged));#endregion//事件处理，需要手工编写，必须是静态方法private static void OnShowBorderChanged(DependencyObject d, DependencyPropertyChangedEventArgs e){var grid = d as Grid;if ((bool)e.OldValue){grid.Loaded -= (s, arg) => { };}if ((bool)e.NewValue){grid.Loaded += (s, arg) =>{//确定行和列数var rows = grid.RowDefinitions.Count;var columns = grid.ColumnDefinitions.Count;//每个格子添加一个Border进去for (int i = 0; i < rows; i++){for (int j = 0; j < columns; j++){var border = new Border() { BorderBrush = new SolidColorBrush(Colors.Gray), BorderThickness = new Thickness(1) };Grid.SetRow(border, i);Grid.SetColumn(border, j);grid.Children.Add(border);}}};}}}
}

<Window x:Class="GridLineTest.MainWindow"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:GridLineTest"xmlns:ext="clr-namespace:Helper"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400" ext:GridLineHelper.ShowBorder="True"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style><Style TargetType="Border"><Setter Property="BorderBrush" Value="Red"></Setter><Setter Property="BorderThickness" Value="1"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock></Grid>
</Window>

        如果有合并的单元格的情况又该如何处理呢？这时就需要用到Grid.SetRowSpan和Grid.SetColumnSpan来附加属性。

using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;namespace Helper
{public class GridLineHelper{#region 可以通过propa快捷方式生成下面段代码public static bool GetShowBorder(DependencyObject obj){return (bool)obj.GetValue(ShowBorderProperty);}public static void SetShowBorder(DependencyObject obj, bool value){obj.SetValue(ShowBorderProperty, value);}public static readonly DependencyProperty ShowBorderProperty =DependencyProperty.RegisterAttached("ShowBorder", typeof(bool), typeof(GridLineHelper), new PropertyMetadata(OnShowBorderChanged));#endregion//事件处理，需要手工编写，必须是静态方法private static void OnShowBorderChanged(DependencyObject d, DependencyPropertyChangedEventArgs e){var grid = d as Grid;string name = grid.Name;if ((bool)e.OldValue){grid.Loaded -= (s, arg) => { };}if ((bool)e.NewValue){grid.Loaded += (s, arg) =>{//根据Grid中子控件的个数去添加边框，同时考虑合并的情况var controls = grid.Children;var count = controls.Count;for (int i = 0; i < count; i++){var item = controls[i] as FrameworkElement;var border = new Border(){BorderBrush = new SolidColorBrush(Colors.LightGray),BorderThickness = new Thickness(1)};var row = Grid.GetRow(item);var column = Grid.GetColumn(item);var rowspan = Grid.GetRowSpan(item);var columnspan = Grid.GetColumnSpan(item);Grid.SetRow(border, row);Grid.SetColumn(border, column);Grid.SetRowSpan(border, rowspan);Grid.SetColumnSpan(border, columnspan);grid.Children.Add(border);}};}}}
}

<Window x:Class="GridLineTest.MainWindow"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:GridLineTest"xmlns:ext="clr-namespace:Helper"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400" ext:GridLineHelper.ShowBorder="True" x:Name="MyGrid"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"></TextBlock><!--<TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock>--><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2"></TextBlock><!--<TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock>--></Grid>
</Window>

        四、补充

        有时需要遍历Grid中的所有元素来做映射等功能，为了方便和减少循环的数据量，会剔除其中的Border元素，可以使用下方行代码实现：

var childrens = this.MyGrid.Children.OfType<UIElement>().ToList().Except(this.MyGrid.Children.OfType<Border>().ToList()).ToList();

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

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

相关文章

二叉树习题精讲-相同的树

二叉树习题精讲-相同的树

相同的树 100. 相同的树 - 力扣&#xff08;LeetCode&#xff09;https://leetcode.cn/problems/same-tree/description/ /*** Definition for a binary tree node.* struct TreeNode {* int val;* struct TreeNode *left;* struct TreeNode *right;* };*/ bool i…
阅读更多...
考研经验总结——复试上岸（附通信原理）

考研经验总结——复试上岸（附通信原理）

上岸啦&#xff0c;一志愿拟录取&#xff0c;初试第5、复试4&#xff0c;总成绩第4 文章目录 一、复试流程二、注意事项三、简历模板3.1 基本信息3.2 报考情况3.3 校内实践3.4 荣誉奖励3.5 项目经验3.6 自我介绍 四、通信原理五、最后的总结 一、复试流程 1、 复试流程 准备复…
阅读更多...
基于Netty实现WebSocket服务端

基于Netty实现WebSocket服务端

本文基于Netty实现WebSocket服务端&#xff0c;实现和客户端的交互通信&#xff0c;客户端基于JavaScript实现。 在【WebSocket简介-CSDN博客】中&#xff0c;我们知道WebSocket是基于Http协议的升级&#xff0c;而Netty提供了Http和WebSocket Frame的编解码器和Handler&#…
阅读更多...
N1912A P 系列双通道功率计

N1912A P 系列双通道功率计

N1912A 双通道功率计 产品综述 <<<P 系列双通道功率计>>> Keysight N1912A P 系列双通道功率计可以提供峰值功率、峰均比、平均功率、上升时间、下降时间 NS 脉冲宽度测量。 “ 功能特点 30 MHz 视频带宽 能够以高达 100 MSa/s 的采样率执行单次实时捕…
阅读更多...
2种方法将集合数据List构建成树形结构

2种方法将集合数据List构建成树形结构

文章目录 递归循环构建树结构hutool.TreeUtil.build构建树结构 递归循环构建树结构 先查最外层树节点数据&#xff0c;再递归遍历每一层子节点数据 public ApiResultDto<List<LocationDto>> getTreeByParams(LocationSearchDto searchDto, SecurityUser user) {// …
阅读更多...
柔性自驱动生物“电子衣”促进伤口愈合

柔性自驱动生物“电子衣”促进伤口愈合

引用信息 文 章&#xff1a;Combined Amniotic Membrane and Self-Powered Electrical Stimulator Bioelectronic Dress Promotes Wound Healing 期 刊&#xff1a;ACS Applied Materials & Interfaces&#xff08;影响因子&#xff1a;9.5&#xff09; 发表时间…
阅读更多...
如何高效搜索？99%的人都不知道的搜索进阶小技巧

如何高效搜索？99%的人都不知道的搜索进阶小技巧

如何高效搜索任何你想要的信息&#xff1f; 比如怎么找第一手的行业研究报告&#xff1f; 在哪查高清无码的图片素材&#xff1f; 怎么搜最新的AI工具教程&#xff1f; 遇到以上问题你会怎么搜&#xff1f; 可能大部分人都是直接打开百度查关键词&#xff0c;虽然随便一搜…
阅读更多...
【贪心算法】C++ 解决算法题：买卖股票 / K次取反 / 按身高排序 / 优势洗牌

【贪心算法】C++ 解决算法题：买卖股票 / K次取反 / 按身高排序 / 优势洗牌

1. 前言 1.1 贪心算法介绍 贪心算法&#xff08;Greedy Algorithm&#xff09;是一种在每一步选择中都采取当前状态下最优决策的算法。贪心算法通常用来解决最优化问题&#xff0c;其核心思想是通过局部最优解逐步推导出全局最优解。 在贪心算法中&#xff0c;我们并不总是考…
阅读更多...
云计算-交互式数据处理 (Interactive Data Processing)

云计算-交互式数据处理 (Interactive Data Processing)

AWS Glue DataBrew (AWS Glue DataBrew) 数据预处理是任何数据分析任务之前的重要步骤。AWS Glue DataBrew 是一个可视化工具&#xff0c;允许我们预处理数据&#xff0c;包括清洗和规范化数据。此AWS服务提供许多数据准备功能&#xff0c;包括分组、联接、过滤、重新采样、排序…
阅读更多...
【数据结构（邓俊辉）学习笔记】二叉树04——Huffman树

【数据结构（邓俊辉）学习笔记】二叉树04——Huffman树

文章目录 0. 概述1. 无前缀冲突编码2. 编码成本3. 带权编码成本4. 编码算法5. 算法实现流程6. 时间复杂度与改进方案 0. 概述 学习Huffman树。 1. 无前缀冲突编码 在加载到信道上之前&#xff0c;信息被转换为二进制形式的过程称作编码&#xff08;encoding&#xff09;&…
阅读更多...
【随笔】Git 实战篇 -- Git Rebase出错？手把手教你如何优雅地解决常见问题 （四十二）

【随笔】Git 实战篇 -- Git Rebase出错？手把手教你如何优雅地解决常见问题 （四十二）

&#x1f48c; 所属专栏&#xff1a;【Git】 &#x1f600; 作  者&#xff1a;我是夜阑的狗&#x1f436; &#x1f680; 个人简介&#xff1a;一个正在努力学技术的CV工程师&#xff0c;专注基础和实战分享 &#xff0c;欢迎咨询&#xff01; &#x1f496; 欢迎大…
阅读更多...
JAVA系列：NIO

JAVA系列：NIO

NIO学习 一、前言 先来看一下NIO的工作流程图&#xff1a; NIO三大核心组件&#xff0c;channel&#xff08;通道&#xff09;、Buffer&#xff08;缓冲区&#xff09;、selector&#xff08;选择器&#xff09;。NIO利用的是多路复用模型&#xff0c;一个线程处理多个IO的读…
阅读更多...
探秘三相交流电子负载应用

探秘三相交流电子负载应用

三相交流电子负载是模拟实际负载的电子设备&#xff0c;主要用于电源、电机、变压器等产品的性能测试和老化试验。它能够精确控制电流、电压、频率等参数&#xff0c;模拟各种复杂的负载情况&#xff0c;为产品研发和质量控制提供可靠的测试手段。 三相交流电子负载在电源产品测…
阅读更多...
4. 排序算法

4. 排序算法

文章目录 1.简单排序1.1 冒泡排序1.1.1 步骤核心思想1.1.2 参考代码1.1.3 时间复杂度1.1.4 空间复杂度1.1.5 优化 1. 2. 选择排序1.2.1 核心思想1.2.2 步骤1.2.3 参考代码1.2.4 时间复杂度1.2.5 空间复杂度1.2.6 优化 1.3 插入排序1.3.1 思想1.3.2 步骤1.3.3 参考代码1.3.4 时间…
阅读更多...
js使用链表实现音乐播放器（新增,下一首播放,置顶，删除）

js使用链表实现音乐播放器（新增,下一首播放,置顶，删除）

什么是链表 链表是一种线性数据结构&#xff0c;与数组类似&#xff0c;它用于存储一系列元素。不过&#xff0c;与数组在内存中连续存储元素不同&#xff0c;链表中的元素&#xff08;称为节点&#xff09;在内存中可以是非连续存放的。每个节点包含两部分&#xff1a;一部分…
阅读更多...
Java开发的saas模式智能制造超强云MES系统源码springboot+mysql+uniapp一整套云MES系统源码

Java开发的saas模式智能制造超强云MES系统源码springboot+mysql+uniapp一整套云MES系统源码

Java开发的saas模式智能制造超强云MES系统源码springbootmysqluniapp一整套云MES系统源码 智能制造超强云MES系统概述&#xff1a; MES以生产车间管理为核心&#xff0c;帮助企业实现生产动态监控和管理。把制造数据管理、计划排程管理、生产调度管理、库存管理、质量管理、人…
阅读更多...
swagger-ui页面接口的入参出参与代码实体类不一致有差异、swagger请求实体与预期定义不符、swagger参数与实体中参数不一致原因分析

swagger-ui页面接口的入参出参与代码实体类不一致有差异、swagger请求实体与预期定义不符、swagger参数与实体中参数不一致原因分析

文章目录 一、问题背景二、问题原因及解决方法 一、问题背景 项目集成swagger之后&#xff0c;发现有个接口的请求跟接口对应不上&#xff0c;把其他接口的请求参数放到当前这个请求上了。 如下图&#xff1a;test1接口的请求参数是其他请求的&#xff0c;并不是test1接口的 …
阅读更多...
win10如何查看本机ip地址？三招搞定，快来试试吧

win10如何查看本机ip地址？三招搞定，快来试试吧

在数字化时代&#xff0c;IP地址作为网络设备的唯一标识&#xff0c;对于计算机使用者来说具有重要意义。无论是为了进行网络设置、远程连接&#xff0c;还是解决网络问题&#xff0c;了解如何查看本机IP地址都是一项必备技能。对于使用Windows 10操作系统的用户来说&#xff0…
阅读更多...
简单的 Cython 示例

简单的 Cython 示例

1&#xff0c; pyx文件 fibonacci.pyx def fibonacci_old(n):if n < 0:return 0elif n 1:return 1else:return fibonacci_old(n-1) fibonacci_old(n-2) 2&#xff0c;setup.py setup.py from setuptools import setup from Cython.Build import cythonizesetup(ext_mod…
阅读更多...
node.js（express）+MongoDB快速搭建后端---新手教程

node.js（express）+MongoDB快速搭建后端---新手教程

前言&#xff1a; Node.js是一个基于 Chrome V8引擎的JavaScript运行环境&#xff0c;是对于前端工程师来说学习成本最小的后端实现方法&#xff0c;本篇文章总结如何从0-1写一个后端的登录接口 一、检查node环境 先检查自己的node是否安装 一般来说前端工程师的电脑环境肯定…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023