小编Tas*_*min的帖子

我使用 Monaca、Cordova 和 onsenUI 构建了一个基于 Vue.js 的应用程序。我想在我的页面中使用 Google 地图显示我的位置。为了实现这一点，我使用了一个npm包，vue2-google-maps但它没有显示任何内容。

我使用的代码来自软件包的官方文档。它们如下所示：

    <template>
      <v-ons-page>
        <custom-toolbar>Page 1</custom-toolbar>
        <div>
       <gmap-map
        :center="center"
        :zoom="7"
        style="width: 500px; height: 300px"
       >
        <gmap-marker
          :key="index"
          v-for="(m, index) in markers"
          :position="m.position"
          :clickable="true"
          :draggable="true"
          @click="center=m.position"
        ></gmap-marker>
      </gmap-map>
      </div>
      </v-ons-page>
    </template>
    <script>
    import * as VueGoogleMaps from 'vue2-google-maps';
      import Vue from 'vue';

      Vue.use(VueGoogleMaps, {
        load: {
          key: 'AIzaSyDX3SEHwFUY-k_Jp7YMp0-uTvo7up-paXM',
          v: '3.26',
          // libraries: 'places', //// If you need to use place input
        }
      });

      export default {
        data () { …

我使用Vue-chart.js开发了一个水平条形图，所有数据和标签都来自API。问题是该值也与标签一起可见，如何隐藏出现在标签旁边的值？图像如下

我有以下代码。

import { HorizontalBar } from 'vue-chartjs'

export default {
    name: 'diagram',
    extends: HorizontalBar,
    data: () => ({
        chartData: '',
        score: {},
        value: [],
        keys: [],
        options: {
            scales: {
                xAxes: [{
                    ticks: {
                        scaleShowLabels:false,
                    }
                }],
                yAxes: [{
                    ticks: {
                        scaleShowLabels:false,
                        mirror: true
                    }
                }]
            },
            responsive: true,
        },

        responsive: true,
        maintainAspectRatio: false

    }),
    created () {

        // Overwriting base render method with actual data.
        this.$http({
            method: 'get',
            url: this.base_url + '/exam/api/score/' + this.$store.state.user.id + '/',

            auth: { …

我使用以下代码在我的基于 Vue.js 和 Onsen UI 的应用程序中加载图像。但他们没有显示。

  <div class="footer_logo">
    <ul>
      <li class=""><img :src="logo" alt="logo" /></li>
    </ul>
  </div>

我在脚本中使用以下代码导入了图像

import foot1 from 'static/assets/img/footerlogos/1.svg';
export default {
  data() {
      logo: foot1;
  }

编辑

项目结构

我有一个名为name和attendance两列的表,这是一个单选按钮,我想实现每当我点击一行时,我得到该行的名称和出勤的值.问题是每当我点击一行时,事件就会触发两次,并显示两次名称.我在下面添加了代码

<table class="col-md-12 text-center">
    <tr>
        <th class="text-center">Name</th>
        <th class="text-center">Attendance</th>

    </tr>
    <tr class="" data-id='1'>
        <td>Md. Khairul Basar</td>
        <td class="form-inline table_attendance">
            <div class="form-check form-check-radio">
                <label class="form-check-label">
                    <input class="form-check-input" type="radio" name="exampleRadio"
                           id="exampleRadios1" value="option1">
                    <span class="form-check-sign"></span>
                    Present
                </label>
            </div>
            <div class="form-check form-check-radio">
                <label class="form-check-label">
                    <input class="form-check-input" type="radio" name="exampleRadio"
                           id="exampleRadios2" value="option2" checked>
                    <span class="form-check-sign"></span>
                    Absent
                </label>
            </div>
        </td>
    </tr>
</table>

以下是jQuery代码.

<script>

    $(document).ready(function () {
        $(".table_attendance").on('click', function () {
            var attendance = {
              name: $(this).closest("tr").find("td:nth-child(1)").text()
            }
        });
    });

</script>

我已经按照与此问题相关的其他答案添加了他们的解决方案,例如添加.off("click") …