通过Blazor使用C#开发SPA单页面应用程序(2)

  • 时间:
  • 浏览:0
  • 来源:大发uu快3_uu快3开奖历史_大发uu快3开奖历史

通过Blazor使用C#开发SPA单页面应用守护多多线程 (1) - 简介及特点

通过Blazor使用C#开发SPA单页面应用守护多多线程 (2) - 开发环境

通过Blazor使用C#开发SPA单页面应用守护多多线程 (3) - 基础知识

 通过Blazor使用C#开发SPA单页面应用守护多多线程 (4) - Ant Design Button

今天亲戚朋友 尝试创建2个 默认的Blazor应用。

.Net Core 3.0前要Visual Studio 2019 的支持。

安装.Net Core 3.0 预览版 SDK版本,注意预览版对应的VS版本,我这里安装的是v3.0.0-preview6。

一定要开启预览选项还上能使用Net Core Preview,在工具> 选项>预览功能 中开启。

新建Asp.net Core Web 应用守护多多线程 ,项目名称:BlazorDemo

目前Blazor还能不还上上能 创建基于服务器端渲染的项目。

项目创建后延续以往Asp.net风格,模板会创建项目框架及样例页面,运行都是得到原来 2个 SPA页面。亲戚朋友 通过开发者工具观察,点击Click me按钮后,右侧的元素中却说数值Dom节点有变化,这个越来越,达到局部更新的效果。

亲戚朋友 在看看项目正确处理方案的特性,好熟悉啊,基本全部却说Asp.net mvc 的特性嘛。

这个 _Host.cshtml 页面应该却说Blazor的主页面,类事vue 的index.html 页。

亲戚朋友 再看看那个Counter 的计数器组件是怎样才能实现的。

@page "/counter"

<h1>Counter</h1>

<p>Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="@IncrementCount">Click me</button>

@code {

int currentCount = 0;

void IncrementCount()

{

currentCount++;

}

}

@page "/counter" 定义路由

<p>Current count: @currentCount</p> 显示计数器变量值

<button class="btn btn-primary" @onclick="@IncrementCount">Click me</button>

指定样式,绑定onclick事件,调用IncrementCount辦法

void IncrementCount()

{

   currentCount++; 计数器+1

}

上边的代码我我觉得简单,但充分说明了Blazor组件开发的模式,有C#和Asp.net mvc 开发经验的全部还前要驾驭。

越来越Blazor组件是怎样才能做到局部更新的呢,原来 上边的代码经过编译都是生成以下内容,RenderTreeBuilder 为每2个 元素、属性、事件指定2个 编号。更多的内容还有待我就让 挖掘,好了今天就到这里了,休息休息一下。

猜你喜欢

學好中文 人生贏家敲門磚

圖:蘇發努馮大學孔子學院在老撾第二大城市琅勃拉邦,有一座僅次於國立大學的高校:蘇發努馮大學。從校門進入繞過寬大的草坪就能就看「孔子學院」的指示牌,院長張明虎(左圖)說雖然他們才

2020-01-20

Antonio Montiel数据,Antonio Montiel新闻,Antonio Montiel视频,Antonio Montiel身价

首页新闻视频直播数据APP懂球号直播君广告合作协议方式AntonioMontielAntonioMontiel俱乐部:国籍:西班牙身高:184CM位置:球员年龄:29岁体重:7

2020-01-20

暗示防长要下台?特朗普:马蒂斯“像民主党人”

美国防部长詹姆斯·马蒂斯。(图源:美联社)美国总统唐纳德·特朗普在当地时间周日(14日)曝光的一段公开采访片段中表示,国防部长詹姆斯·马蒂斯(JamesMattis)“一阵一阵

2020-01-20

阿姆利奥VS贝里奥免费视频直播,阿姆利奥VS贝里奥比赛集锦,阿姆利奥VS贝里奥录像,阿姆利奥VS贝里奥首发阵容

首页新闻视频直播数据APP懂球号直播君广告公司合作 阿姆利奥05-0600:00西丙2-5已始于贝里奥直播君|分析|集锦暂无数据近期比赛萨索洛意甲2-1都灵纽卡斯尔联英超1-

2020-01-20

欧迪兹亚VS德乌斯托免费视频直播,欧迪兹亚VS德乌斯托比赛集锦,欧迪兹亚VS德乌斯托录像,欧迪兹亚VS德乌斯托首发阵容

首页新闻视频直播数据APP懂球号直播君广告商务战略合作欧迪兹亚05-0523:00西丙1-2已开始德乌斯托直播君|分析|集锦暂无数据近期比赛萨索洛意甲2-1都灵纽卡斯尔联英超1

2020-01-20