仿牛客论坛的一些细节改进

私信列表的会话头像链接到个人主页

原来的不足

点击私信列表的会话头像应该要能跳转到该目标对象的个人主页。

原来的代码:

<a href="profile.html">
	<img th:src="${map.target.headerUrl}" class="mr-4 rounded-circle user-header" alt="用户头像" >
</a>

原来的效果:在这里插入图片描述
可以看到左下角的路径是这样的。在这里插入图片描述
从头像点进去是404。

改进

1.个人主页的路径是{user/profile/{userId}},所以需要知道target的userId
2.通过debug知道target的userId是map.target.id

改进后的代码:

<a th:href="@{|/user/profile/${map.target.id}|}">
	<img th:src="${map.target.headerUrl}" class="mr-4 rounded-circle user-header" alt="用户头像" >
</a>

改进后的效果:

在这里插入图片描述

光标放在会话头像上,左下角路径会动态改变了。

在这里插入图片描述
点击头像,成功链接到个人主页。

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

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

相关文章

智能优化算法应用:基于黄金正弦算法3D无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用&#xff1a;基于黄金正弦算法3D无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用&#xff1a;基于黄金正弦算法3D无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.黄金正弦算法4.实验参数设定5.算法结果6.…

web前端实现LED功能、液晶显示时间、数字

MENU 效果演示html部分JavaScript部分css部分 效果演示 html部分 <div id"app"><!-- 页面 --><div class"time-box"><!-- 时 --><div class"house-box"><bit-component :num"houseTem"></bit…

【MODBUS】Modbus是什么?

Modbus协议&#xff0c;从字面理解它包括Mod和Bus两部分&#xff0c;首先它是一种bus&#xff0c;即总线协议&#xff0c;和12C、SP|类似&#xff0c;总线就意味着有主机&#xff0c;有从机&#xff0c;这些设备在同一条总线上。 Modbus支持单主机&#xff0c;多个从机&#xf…

Colorful Grid Codeforces Round 910 (Div. 2) C

Problem - C - Codeforces 题目大意&#xff1a;有一个n*m的网格&#xff0c;要求从(1,1)走到(n,m)&#xff0c;同时要求路径的长度必须为k1&#xff0c;然后给每个两点之间的路径染成红色或蓝色&#xff0c;要求任意两个相邻线段颜色不能相同&#xff0c;求涂色的方案 3<…

将程序注册为系统服务

cmd中执行命令&#xff1a; sc create Redis binpath "C:\guet_run1\Redis-x64-5.0.14.1\redis-server.exe" type own start auto displayname "Redis"注意&#xff0c;命令中所有的等号和值之间需要一个空格&#xff08;等号前不要空格&#xff0c;等号后…

Linux---查看命令帮助

1. 查看命令帮助方式 --help 使用说明: 命令 --helpman 使用说明: man 命令 查看命令帮助的目的说明: 查看命令帮助目的是查看命令选项信息的 --help效果图: man效果图: man命令的说明: 操作键说明空格显示下一屏信息回车显示下一行信息b显示上一屏信息f显示下一屏信息q退…

[c++] 意识需要转变的一个例子,全局变量的构造函数先于main执行

最近还遇到一个例子是关于&#xff1a;从C转C开发需要注意的一个意识问题。本人遇到的这个问题是&#xff0c;带着C的意识来看C的代码&#xff0c;然后根据代码看&#xff0c;有一个全局变量的值在main函数进入之后才会更改&#xff0c;所以百思不得其解&#xff0c;这个变量怎…

RK3568平台 OTA升级原理

一.前言 在迅速变化和发展的物联网市场&#xff0c;新的产品需求不断涌现&#xff0c;因此对于智能硬件设备的更新需求就变得空前高涨&#xff0c;设备不再像传统设备一样一经出售就不再变更。为了快速响应市场需求&#xff0c;一个技术变得极为重要&#xff0c;即OTA空中下载…

ES中根据主键_id查询记录

一、需求 es中_type&#xff1a;_doc&#xff0c;想要根据主键_id查询记录 二、实现 复合查询中使用语句查询http://192.168.1.1/_doc/1

智能分析/可视化安防监控系统EasyCVR风光互补远程视频监控方案

一、背景需求 在一些偏远地区&#xff0c;也具有视频监控的需求。但是这类场景中&#xff0c;一般无法就近获取市电&#xff0c;如果要长距离拉取市电&#xff0c;建设的成本非常高且长距离传输有安全隐患&#xff0c;因此风光互补远程视频监控方案的需求也较多。利用风光电转…

将创建表字段语句快速转换成golang struct字段

用网页jquery快速生成 本地建立 struct.html <!DOCTYPE html> <html> <head> <meta charset"utf-8"> <title>leo-转换</title> <script src"https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></s…

代码审计是什么,为什么需要代码审计

随着软件开发技术的不断发展&#xff0c;代码审计变得越来越重要&#xff0c;因为它可以帮助帮助企业从安全角度对应用系统的所有逻辑路径进行测试&#xff0c;通过分析源代码&#xff0c;充分挖掘代码中存在的安全缺陷以及规范性缺陷。找到普通安全测试所无法发现的如二次注入…

Visual Studio Code中tasks.json全局任务命令选项CommandOptions配置介绍

☞ ░ 前往老猿Python博客 ░ https://blog.csdn.net/LaoYuanPython 一、引言 从官方文档可见&#xff0c;一个vscode典型的task.json文件包含多种属性&#xff0c;格式复杂&#xff0c;任务可以分为全局任务和局部可选任务&#xff0c;在tasks.json一级配置的 任务为全局任务…

STM32-02-STM32基础知识

文章目录 STM32基础知识1. STM32F103系统架构2. STM32寻址范围3. 存储器映射4. 寄存器映射 STM32基础知识 1. STM32F103系统架构 STM32F103 STM32F103是ST公司基于ARM授权Cortex M3内核而设计的一款芯片&#xff0c;而Cortex M内核使用的是ARM v7-M架构&#xff0c;是为了替代…

Tensorboard可视化远程服务器上保存的训练文件

方法一&#xff1a; 最简单的&#xff0c;把服务器上的训练权重文件下载到本地&#xff0c;使用本地的tensorboard打开 方法二&#xff1a; 使用VsCode的remote ssh插件&#xff0c;可以通过端口映射&#xff0c;将远程的6006端口映射到本地&#xff0c;直接访本地的6006即可…

【图论】普利姆算法,最小生成树

一次加入一个节点到我们的最下生成树中。加入哪个&#xff1f;跟着下面的步骤走一遍你就会了。 1. 把第一个节点A添加进来 2. 看两条边<A,B>,<A,E>,一个长度是3&#xff0c;一个长度是4&#xff0c;把长度短的边的另一个节点添加进来&#xff0c;也就是B 3. 再看A,…

多线程------ThreadLocal详解

目录 1. 什么是 ThreadLocal&#xff1f; 2. 如何使用 ThreadLocal&#xff1f; 3. ThreadLocal 的作用 4. ThreadLocal 的应用场景 5. ThreadLocal 的注意事项 我的其他博客 ThreadLocal 是 Java 中一个很有用的类&#xff0c;它提供了线程局部变量的支持。线程局部变量…

LangChain学习二:提示-实战(上半部分)

文章目录 上一节内容&#xff1a;LangChain学习一&#xff1a;模型-实战学习目标&#xff1a;提示词及提示词模板的运用学习内容一&#xff1a;什么是提示词&#xff1f;学习内容二&#xff1a;提示词模板2.1 入门2.2 模板格式2.3 验证模板2.4 序列化提示模板2.5 将少量示例传递…

从 AST 到代码生成:代码背后的秘密花园(下)

&#x1f90d; 前端开发工程师&#xff08;主业&#xff09;、技术博主&#xff08;副业&#xff09;、已过CET6 &#x1f368; 阿珊和她的猫_CSDN个人主页 &#x1f560; 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 &#x1f35a; 蓝桥云课签约作者、已在蓝桥云…

Selenium三大等待(详解版)

一、强制等待 1.设置完等待后不管有没有找到元素&#xff0c;都会执行等待&#xff0c;等待结束后才会执行下一步 2.实例&#xff1a; driver webdriver.Chrome()driver.get("https://www.baidu.com")time.sleep(3) # 设置强制等待driver.quit() 二、隐性等待 …