我做了酱紫一个Vue.js的组件：//nav.js文件的代码Vue.component('nav-ul-li', { props:["url"], template: '<li> <a :href="url"><slot></slot></a> </li>'})写了酱紫一个文档：<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Test Document</title><script src="/js/vue.js"></script><script src="/js/nav.js"></script></head><body> <div id="frame"> <nav id="top"> <ul class="nav_top"> <!--就是这个AAA--> <nav-ul-li v-for="data in datas" :href="data.src">{{data.title}}</nav-ul-li> </ul> </nav> </div> <script> var Crowdfunding = new Vue({ el: '#frame', data: { datas: [ { title: 'Test Data' , src: "#"}, { title: 'Test Data' , src: "#"}, { title: 'Test Data' , src: "#"}, { title: 'Test Data' , src: "#" } ] } }) </script></body></html>结果，<nav-ul-li v-for="data in datas" :href="data.src">{{data.title}}</nav-ul-li>被解析成酱紫TAT：<li href="#"><a>Test Data</a></li>它的我给a标签留的href属性为什么会被li标签抢走TAT???
1 回答
尚方宝剑之说
TA贡献1788条经验 获得超4个赞
li表示这个锅它不背，因为你传给nav-ul-li组件的prop是href，而组件内部定义的props是url。
这样改一下就好了：
<nav-ul-li v-for="data in datas" :url="data.src">{{data.title}}</nav-ul-li>添加回答
举报
0/150
提交
取消