MVC:SelectListItem构建下拉框选项dropdown

1.先定义一个Model

public class CustomerViewModel
    {
        public string FullName { get; set; }
        public string Phone { get; set; }
        public int TotalAmount { get; set; }

        public List<SelectListItem> getFruitType()
        {
            List<SelectListItem> fruitList = new List<SelectListItem>();
            var data = new[]
            {
                new SelectListItem{Value="1",Text="Apple"},
                new SelectListItem{Value="2",Text="Banana"},
                new SelectListItem{Value="3",Text="Grape"},
                new SelectListItem{Value="4",Text="Kiwi"}
            };
            fruitList = data.ToList();
            return fruitList;
        }
    }

2.Controller写法：

 public ActionResult Index()
        {
            CustomerViewModel model = new CustomerViewModel();
            ViewData["Fruit"] = model.getFruitType();
            return View();
        }

3.前端写法，如果直接foreach  ViewData["Fruit"]会出现如下报错：

 

修改后的前端代码如下：

<h2>SelectListItem</h2>

<select id="fruitSelect" name="fruitSelect">
    @foreach (SelectListItem item in (IEnumerable<SelectListItem>)ViewData["Fruit"])
    {
        <option value="@item.Value">@item.Text</option>
    }
</select>

4.测试结果如下