Question

我在传递给组件的数据上遇到麻烦。它将仅显示为对象，而不显示为对象中的项目。我有从此处阅读了几个问题/答案，但我仍然无法使它起作用。

当我尝试import numpy as np from sklearn import preprocessing, neighbors import pandas as pd from sklearn.model_selection import train_test_split df = pd.read_csv('breast-cancer-wisconsin.txt') df.replace('?', -99999, inplace=True) df.drop(['id'], 1, inplace=True) X = np.array(df.drop(['class'],1)) y = np.array(df['class']) X_train,y_train,X_test,y_test = train_test_split(X,y, test_size=0.2) clf = neighbors.KNeighborsClassifier() print(X_train.shape) print(y_train.shape) clf.fit(X_train, y_train) accuracy = clf.score(X_test, y_test) print (accuracy)（在孩子中）时，它将在控制台中显示此错误“渲染错误：” TypeError：_vm.modalData为null“”

这是我的代码：父母

{{ modalData.projectName }}

子组件：

<template>
   <section id="portFolio">
      <div class="row">
     <div  
        v-for="project in projects" 
        v-bind:key="project.id" 
        class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-xl-3"
     >
        <a type="button" data-toggle="modal" data-target="#exampleModal" v-on:click="openModal(project)">
           <div class="project-block">

              <!-- Image -->
              <div class="image-preview">
                 <img src="/dist/img/logo-test.png" class="img-fluid" alt="Twitter">
              </div>

              <!-- Details -->
              <div class="project-details p-t-10 p-b-10 p-l-10 p-r-10">
                 <div class="">
                    <h5 class="text-purple m-b-5">{{ project.projectName }}</h5>
                    <p class="text-dark">{{ project.companyName }}</p>
                 </div>
                 <p class="subtext text-dark">{{ project.projectYear }}</p>
              </div>

           </div>
        </a>

     </div>
      </div>
      <app-modal ref="modal" v-bind:modalData="selectedItem"/>
   </section>
</template>

<script>
// Component
import modalBlock from "./component/portfolio/portfolioModal.vue";

export default{
  name: "portFolio",
  components: {
   'app-modal': modalBlock
  },
   data() {
      return {
     // showModal: false,
     selectedItem: null,
     projectName: '', 
    companyName: '', 
    projectYear: null,
    previewPic: '',
    testText: '',
    modalData: '',
     projects: [
        {
           projectName: 'Project One', 
           companyName: 'CoolCompany Sdn Bhd', 
           projectYear: 2019,
           previewPic: "/dist/img/logo-test.png",
           testText: "First object"
        },
        {
           projectName: 'Project Two', 
           companyName: 'NotSoCompany Sdn Bhd', 
           projectYear: 2018,
           previewPic: "/dist/img/logo-test.png",
           testText: "Second object"
        },
        {
           projectName: 'Project Three', 
           companyName: 'LameCompany Sdn Bhd', 
           projectYear: 2017,
           previewPic: "/dist/img/logo-test.png",
           testText: "Third object"
        }
     ]
  }
    },
  methods: {

openModal(modalData) {
  this.selectedItem = modalData
  let element = this.$refs.modal.$el
  $(element).modal('show')
}

  }
}

</script>

我可以知道我在哪里做错了吗？还是我忘了在代码上声明一些内容？

谢谢

Vue JS：模态组件上的道具不断显示typeError

0 个答案: