Vue js支持无数据

nwwlzxa7 于 2023-02-09 发布在 Vue.js

关注(0)|答案(1)|浏览(167)

我不能在VueJS中传递数据到 prop 。下面是我的代码：

const projects = [{ id: 1, name: 'First', img: "https://randomwordgenerator.com/img/picture-generator/53e0d7414855ac14f1dc8460962e33791c3ad6e04e5074417d2e72d2964cc6_640.jpg" },
{ id: 2, name: 'Second', img: "https://randomwordgenerator.com/img/picture-generator/paper-1100254_640.jpg" },
{ id: 3, name: 'Third', img: "https://randomwordgenerator.com/img/picture-generator/5fe2d4414352b10ff3d8992cc12c30771037dbf85254794075287cd69145_640.jpg" },
{ id: 4, name: 'Forth', img: "https://randomwordgenerator.com/img/picture-generator/5fe1d3414256b10ff3d8992cc12c30771037dbf8525478487c2f79d5924e_640.jpg" }
] 
const Project = {
    props: ['img', 'name'],
    template: `
    <div class="container projectbox">
        <div class="textandimage"> Name: {{ projects.name }} </div>
    </div>
    `,
    
    data() {
        return {
            projects
        }
    }
}

img：未定义名称：未定义

vue.js

来源：https://stackoverflow.com/questions/62968124/vue-js-props-no-data

1条答案

按热度按时间

owfi6suc1#

项目 * 是对象的列表（数组）。如果要访问列表中的对象，则需要引用其位置。例如：

<div class="textandimage"> Name: {{ projects[0].name }} </div>

这将访问列表中的第一个Object，并返回键name的值

编辑：for循环

如果你想循环数据到模板，请执行如下操作：

<div v-for="(item, index) in projects" class="container projectbox" :key="index">
  <div class="textandimage"> Name: {{ item.name }} </div>
</div>

希望你能理解。

赞(0）回复(0）举报 2023-02-09

我来回答

Vue js支持无数据

1条答案

相关问题

热门标签

最新问答