在ASP项目中使用VueJS
问题描述:
当前正在开发ASP MVC站点。 该网站的某些部分将使用VueJS来显示一些列表,表格等。 项目设置是Bower,Grunt,使用TypeScript的标准C#ASP项目。在ASP项目中使用VueJS
这是我第一次使用Vue,简单的东西是相当明显的前进。从一个表单中获取数据,从WebService获取数据等。
我的问题是,什么以及如何获得最佳设置,以便在我的cshtml视图文件中使用单个文件组件(Vue) 。
因此,可以说我在我的网站上有一个部分,我想在其中显示来自用户的订单。 布局,导航等由我的激动人心的ASP代码设置。我有一个CSHTML当前页面的页面,漂亮的香草:
@inherits MyViewPage<MyViewModel>
@{
Layout = "~/Views/layout.cshtml";
}
<div id"app">
</div>
这就是它的兴奋观点页面。在这个页面中,我想包含一个Vue单个文件组件。
此前我有直接在CSHTML页面的标记,这工作正常。但是当我想要用户Vue-router时,维护不同视图成为一个问题。所以我应该把标记移动到一个Component中。
这是基本设置;
const page1 = { template: '<div>Page1</div>' }
const page2 = { template: '<div>Page2</div>' }
const routes = [
{ path: '/', component: page1 },
{ path: '/page2', component: page2 }
]
const router = new VueRouter({
routes
})
var vm = new Vue({
router,
el: "#app"
})
可以说我创建了一个叫做page1.vue的.vue文件。这包含
<template>
my new page
</template>
<script>
export default {
name: '?',
date: function() {
}
}
</script>
我如何得到这个文件包含在我的CSHTML文件中作为例子?
[在多页现有.NET MVC应用程序中用VueJS 2替换jQuery时的最佳方法](https://*.com/questions/42541315/best-approach-when-replacing-jquery-with- vuejs-2-in-multi-page-existing-net-mvc) – Bert