vue 给组件传参，写入数字没有问题，但直接写入固定字符串报错？

雨点打透心脏的1/2处 2023-02-23 10:58 4阅读 0赞

# Vue 给组件传参，写入数字没有问题，但直接写入固定字符串报错？ #

代码如下：

institution组件在新增、编辑时显示输入框，在查看详情时显示文本

<template>
      <div class="z-input">
        <div class="txt" v-if="isDetail">{
       {inputValue}}</div>
        <el-input
          v-else
          :placeholder="zplaceholder?zplaceholder:选择机构"
          size="small"
          v-model="val"
          :disabled="zdisabled"
          @focus="loadInstitution"
          @change="changeVal"
        ></el-input>   
      </div>
    </template>
    <script>

现在调用方法如下：

在:inputValue中输入“我的组织”，界面怎么都无法显示。

<institution :isDetail="true" :inputValue="我的组织" @modelVal="(val) => { query.sampleDeptName = val }"
                      @modelId="(val) => { query.sampleDeptId = val }" style="width:100%" >
                    </institution>

但:inputValue中输入"111"，界面能正常显示"111"。

而且将:inputValue中的值替换为data()中的变量，也可以，那这就奇怪了。

最后，试验半天，在字符串前后加上单引号，就搞定了。

:inputValue=" ' 我的组织' "

# 总结一下： #

# vue组件传参必须带上自己的类型，例如单引号，虽然冗余了标识。 #

附：或者不用动态绑定，去掉冒号。

如下：

inputValue="我的组织"

发表评论取消回复

表情：

评论列表（有 0 条评论，4人围观）

还没有评论，来说两句吧...

相关阅读

相关把报错信息写入日志

import logging import traceback logging.basicConfig(filename, level, filemode='w', f

谁践踏了优雅/ 2023年06月15日 11:28/ 0 赞/ 47 阅读

相关 vue非父子组件间传参问题

最近在使用vue进行开发，遇到了组件之间传参的问题，此处主要是针对非父子组件之间的传参问题进行总结，方法如下：一、如果两个组件用友共同的父组件，即 Father

末蓝、/ 2023年06月04日 06:56/ 0 赞/ 62 阅读

相关 vue 给组件传参，写入数字没有问题，但直接写入固定字符串报错？

Vue 给组件传参，写入数字没有问题，但直接写入固定字符串报错？代码如下： institution组件在新增、编辑时显示输入框，在查看详情时显示文本 <te

雨点打透心脏的1/2处/ 2023年02月23日 10:58/ 0 赞/ 5 阅读

相关 uni-app，renderjs传参给组件

使用this.$ownerInstance.callMethod(‘组件的方法名’,‘参数’) <script module='sortable' lang="ren

浅浅的花香味﹌/ 2022年12月27日 02:09/ 0 赞/ 614 阅读

相关 Vue 兄弟组件传参

兄弟组件使用 eventBus 实现传值第一步：先创建js文件，位置随便放 import Vue from 'vue' export default ne

小咪咪/ 2022年12月22日 08:41/ 0 赞/ 222 阅读

相关 NoSuchColumnFamilyException ：spark写入hbase报错

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTEx

Bertha 。/ 2022年12月08日 01:58/ 0 赞/ 486 阅读

相关 vue 子组件给父组件传参

vue 子组件给父组件传参代码中 n2 传参了，n1未传 <!DOCTYPE html> <html> <head> <meta

今天药忘吃喽~/ 2022年12月03日 01:41/ 0 赞/ 291 阅读

相关 VUE：父子组件间传参、子组件传值给父组件、父组件传值给子组件

[前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。点击跳转到教程。][Link 1] Vue是一个轻量级的渐进式框架，对于它的一些特性和优点

太过爱你忘了你带给我的痛/ 2022年03月29日 19:40/ 0 赞/ 564 阅读

相关 VUE：兄弟组件间传参

[前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。点击跳转到教程。][Link 1] 1、定义一个中间 eventBus.js ，只有

刺骨的言语ヽ痛彻心扉/ 2022年03月26日 06:58/ 0 赞/ 919 阅读

相关 UltraISO制作启动盘（写入硬盘映像）没有反应、报错或直接退出

点击“写入”按钮后，没有反应，重新点击后直接退出，或者报错如下： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aH

柔情只为你懂/ 2021年10月23日 11:38/ 0 赞/ 2808 阅读