1. 系统默认自带了一个NivoSlider 的Wdget. 在Nop.Web项目首页的HomePageTop里

这个写法是 ASP.NET Core MVC 中的新特性 视图组件,与局部视图相似,但是它们更加的强大。 要使用视图组件,从视图中调用 @Component.InvokeAsync("视图组件名", <匿名类型参数>)

新增一个视图组件的方法(任一):

  • 继承 ViewComponent
  • 使用 [ViewComponent] 特性装饰一个类。
  • 创建一个类,并以 ViewComponent 作为后缀。

我们使用的视图组件Widget是在Nop.Web项目的\Componets\Widget.cs, 里面使用工厂模式,创建Widget

namespace Nop.Web.Components
{
public class WidgetViewComponent : NopViewComponent
{
private readonly IWidgetModelFactory _widgetModelFactory; public WidgetViewComponent(IWidgetModelFactory widgetModelFactory)
{
this._widgetModelFactory = widgetModelFactory;
} public IViewComponentResult Invoke(string widgetZone, object additionalData = null)
{
var model = _widgetModelFactory.PrepareRenderWidgetModel(widgetZone, additionalData); //no data?
if (!model.Any())
return Content(""); return View(model);
}
}
}

WidgetService.cs 里是根据GetWidgetZones()的值load 对应Zone的Widget

        /// <summary>
/// Load active widgets
/// </summary>
/// <param name="widgetZone">Widget zone</param>
/// <param name="customer">Load records allowed only to a specified customer; pass null to ignore ACL permissions</param>
/// <param name="storeId">Load records allowed only in a specified store; pass 0 to load all records</param>
/// <returns>Widgets</returns>
public virtual IList<IWidgetPlugin> LoadActiveWidgetsByWidgetZone(string widgetZone, Customer customer = null, int storeId = )
{
if (string.IsNullOrWhiteSpace(widgetZone))
return new List<IWidgetPlugin>(); return LoadActiveWidgets(customer, storeId)
.Where(x => x.GetWidgetZones().Contains(widgetZone, StringComparer.InvariantCultureIgnoreCase)).ToList();
}

Widget是一个插件,所以要继承NOP的BasePlugin,但Widget和其他插件不同,又要实现IWidgetPlugin的接口

nop 4.1 Widget 探究- 视图组件的更多相关文章

  1. Box(视图组件)如何在多个页面不同视觉规范下的复用

    本文来自 网易云社区 . 问题描述 Android App中的页面元素,都是由一个个Box(可以理解成一个个自定义View组件和Widget同级)组成,这些Box可以在不同的页面.不同的模块达到复用的 ...

  2. ASP.NET Core 中文文档 第四章 MVC(3.9)视图组件

    作者: Rick Anderson 翻译: 娄宇(Lyrics) 校对: 高嵩 章节: 介绍视图组件 创建视图组件 调用视图组件 演练:创建一个简单的视图组件 附加的资源 查看或下载示例代码 介绍视图 ...

  3. iOS系列 基础篇 04 探究视图生命周期

    iOS系列 基础篇 04 探究视图生命周期 视图是应用的一个重要的组成部份,功能的实现与其息息相关,而视图控制器控制着视图,其重要性在整个应用中不言而喻. 以视图的四种状态为基础,我们来系统了解一下视 ...

  4. asp.net core视图组件(ViewComponent)简单使用

    一.组成: 一个视图组件包括两个部分,派生自ViewComponent的类及其返回结果.类似控制器. 定义一个视图组件,如控制器一样,必须是公开,非嵌套,非抽象的类.一般,视图组件名称为类名去掉&qu ...

  5. ASP.NET Core MVC之ViewComponents(视图组件)

    前言 大概一个来星期未更新博客了,久违了各位,关于SQL Server性能优化会和ASP.NET Core MVC穿插来讲,如果你希望我分享哪些内容可以在评论下方提出来,我会筛选并看看技术文档来对你的 ...

  6. ASP.NET Core Razor 视图组件

    视图组件简介 在新的ASP.NET Core MVC中,视图组件类似于局部视图,但它们更强大.视图组件不使用模型绑定,仅依赖于您在调用时提供的数据. 视图组件特性: 呈现页面响应的某一部分而不是整个响 ...

  7. [译]ASP.NET Core 2.0 视图组件

    问题 如何在ASP.NET Core 2.0中使用视图组件? 答案 新建一个空项目,修改Startup类并添加MVC服务和中间件: public void ConfigureServices(ISer ...

  8. ASP.NET CORE 自定义视图组件(ViewComponent)注意事项

    *红色字体为固定命名,蓝色为一般命名规则,黄色为ASP.NET CORE 默认查找文件名 概要:1.简单ViewComponent的用法 2.ViewComponent控制器返回值  3.注意事项 1 ...

  9. Asp.Net core 视图组件ViewComponent

    视图组件 ViewComponent 最近用了一下视图组件,还挺方便的,如果遇到公共的部分,可以抽出来,写成视图组件,方便调用 先上图看一下效果:比如首页的4个画红框的地方是4个模块,有些地方可能要重 ...

随机推荐

  1. P2512 [HAOI2008]糖果传递

    题目描述 有n个小朋友坐成一圈,每人有ai个糖果.每人只能给左右两人传递糖果.每人每次传递一个糖果代价为1. 输入输出格式 输入格式: 小朋友个数n 下面n行 ai 输出格式: 求使所有人获得均等糖果 ...

  2. JVM(一)

    1 Java类加载器包括几种?它们之间的关系是怎么样的?双亲委派机制是什么意思?有什么好处? 启动Bootstrap类加载.扩展Extension类加载.系统System类加载. 类加载器也是Java ...

  3. composer require 指定版本

    默认 composer require endroid/qr-code 指定版本 composer require endroid/qr-code 1.9.3 # composer require e ...

  4. HashMap源码解读

    1.HashMap  1.6解读 a).put,get,遍历方式参看 http://www.cnblogs.com/skywang12345/p/3310835.html#a23 需要注意的是,1.7 ...

  5. Qt5.QString传参数

    1.函数传参,如果是 QString&类型 的话,不能直接 传入 char* 类型的参数,若是声明成 const QString&类型 的话,就可以 解释:应该是 函数调用的时候 编译 ...

  6. MySQL学习(十四)

    utf8的bom问题 在xp下,用记事本创建utf8文件的时候,前面多了3个字节,这3个字节不用来显示,是用来辨识编码用的,EF BB BF告诉记事本,这是utf8编码. 存储引擎和事务简单介绍 引擎 ...

  7. compile FFMPEG under windows

    这个文章应该算是中文版最好的了.但是还有一些需要修正. 特别是winsock2的处理 win10 msys2 vs2015 ffmpeg3.2.2 编译 这个英文版的才是最好的 Building ff ...

  8. learn python the hard way 习题1~5总结

    习题1 print 语句print('Yay! Printing.')print('I "said" do not touch this') 习题2:注释和 # 号 #(octot ...

  9. Maven报错Please ensure you are using JDK 1.4 or above and not a JRE解决方法!

    https://www.cnblogs.com/shihua513/p/6163682.html 在eclipse下用maven编译时,很有可能出现以下错误: Please ensure you ar ...

  10. javascript获取id元素

    function $(id){ return document.getElementById(id); }导致所有的js不能用解决办法....   function $(id){ return doc ...