首页 > 解决方案 > 调用操作方法后的共享布局粉碎?

问题描述

我为我的视图创建了一个通用布局,所以我把它放在共享文件夹中。启动项目控制器触发的索引方法并返回包含所有图像的布局,但是当我单击导航栏中的某个项目时,触发了相应的操作方法,布局中的图像消失了!?

这是我在布局中的标签助手:

<div class="navbar-collapse collapse w-50">
        <ul class="navbar-nav">
            <li class="nav-item navbar1 ">
                <a class="nav-link" asp-controller="Home" asp-action="Index"><span style="text-decoration: underline;"><B>Acceuil</B></span></a>
            </li>
            <li class="nav-item navbar1">
                <a class="nav-link" asp-controller="Home" asp-action="WhoWeAre"><span style="text-decoration: underline;"><B>Qui somme nous</B></span></a>
            </li>
            <li class="nav-item navbar1">
                <a class="nav-link" asp-controller="Home" asp-action="Privacy"><span style="text-decoration: underline;"><B>Specialités</B></span></a>
            </li>
        </ul>
</div>

这些是行动方法:

 public IActionResult Index()
    {
        return View("WhoWeAre");
    }

    public IActionResult WhoWeAre()
    {
        return View();
    }
    public IActionResult ContactUs()
    {
        return View();
    }

    public IActionResult Privacy()
    {
        return View();
    }

我做错了什么?

更新1:

对于图像,我在导航栏中有一个徽标:

<nav class="navbar navbar-expand-md bg-light navbar-light">

        <div class="navbar-collapse collapse w-50">
            <ul class="navbar-nav">
                <li class="nav-item navbar1 ">
                    <a class="nav-link" asp-controller="Home" asp-action="Index"><span style="text-decoration: underline;"><B>Acceuil</B></span></a>
                </li>
                <li class="nav-item navbar1">
                    <a class="nav-link" asp-controller="Home" asp-action="WhoWeAre"><span style="text-decoration: underline;"><B>Qui somme nous</B></span></a>
                </li>
                <li class="nav-item navbar1">
                    <a class="nav-link" asp-controller="Home" asp-action="Specialites"><span style="text-decoration: underline;"><B>Specialités</B></span></a>
                </li>
            </ul>
        </div>
        <div>
       <!-- this is the logo-->
            <img src="images/decoupage/nawrass-logo.png " class="rounded-circle bg-light">....

在页脚中,我再次有徽标和其他一些图像:

<div id="footer">
 <div class="jumbotron " style="margin-top:0 ; background-color:blue">
    <div class="container ">
       <div class="row">
        <div class="col-md-6">
            <div class="card mb-3 " style="background-color: blue">
                <div class="row no-gutters">
                    <div class="col-md-3 ">

                        <img src="images/decoupage/logo-white.png" class="card-img" alt="my card image">
                    </div>......

标签: asp.net-mvc

解决方案


您的图像来源是相对的。MVC 使用路由,这使您的 URL 路径看起来像“文件夹”。

所以 "Home" 是/,这是默认路由,但 "Who we are" 是/Home/WhoWeAre/images/decoupage/logo-white.png这导致图像分别在和中查找/Home/images/decoupage/logo-white.png

鉴于图像在根文件夹中,而不是在 中/Home,您需要在图像 URL 前加上/.


推荐阅读