我使用的是 MacBook Pro

• M1芯片
• MacOS 大苏尔
• Xcode 版本 13.2.1
• 节点 v14.17.5

我想按照本教程设置一个名为 AwesomeProject https://reactnative.dev/docs/environment-setup的新 React Native 项目，其中包含 React Native CLI 快速入门部分。

当我尝试通过键入以下内容在终端中运行应用程序时： npx react-native run-ios 我的构建失败并出现以下错误：

PhaseScriptExecution [CP-User]\生成\规格/Users/thomashuber/Library/Developer/Xcode/DerivedData/AwesomeProject-aprperxvqrezbfeyvousbagyesvr/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/FBReactNativeSpec.build/Script-5F4C70EF7D90A5A5BDAEB404279F232A.sh （在项目“Pods”的目标“FBReactNativeSpec”中）（1 次失败）

当我尝试在模拟器或 iPhone 设备上的 Xcode 中运行它时，我在FBReactNativeSpec中收到以下错误：

命令 PhaseScriptExecution 失败，退出代码非零

我运行它

/bin/sh -c /Users/thomashuber/Library/Developer/Xcode/DerivedData/AwesomeProject-aprperxvqrezbfeyvousbagyesvr/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/FBReactNativeSpec.build/Script-5F4C70EF7D90A5A5BDAEB404279F232A.sh

我重新启动了 MacBook，删除了该项目并再次尝试。我在 Xcode 中清理了该项目，但没有任何帮助。我怀疑这是由于我的 MacBook 的 M1 芯片造成的。

我正在测试这个组件，它只是根据输入字段中的新输入来更改其状态，并将输入元素的值设置为该状态。

function Login () {
    //Login Credentials
    const [loginCredentials, setLoginCredentials] = useState({ name: '' })
    const handleChange = ({target}) => {
        setLoginCredentials(prev => ({ ...prev, [target.name]: target.value }));
    }

    return (
            <div className="login-container">
                <h1>Log In</h1>
                    <div className="login-label-input">
                        <label htmlFor="name">Account Name
                            <input
                            type="name"
                            id="name"
                            name="name"
                            placeholder="Enter Name"
                            onChange={handleChange}
                            value={loginCredentials.name}
                            aria-label="name"
                            />
                        </label>
                  </div>
             </div>
    )
}

由于某种原因，此测试不会在 screen.debug() 中显示输入值“testUser”，而仅显示“t”....

    test("log in with empty name input returns error message",  () => {
    render(<Login />)
    const nameField = screen.getByLabelText(/account name/i);
    userEvent.type(nameField, 'testUser'); 
    screen.debug() …

我最近从 Vue 2 升级到 Vue 3，我的应用程序的某些部分在development模式下发出警告：

[Vue warn]：模板编译错误：具有副作用的标签（<script> 和 <style>）在客户端组件模板中被忽略。

在 Vue 2 中，这些警告只是隐藏在production. 然而，在 Vue 3 中，带有这些警告的页面完全崩溃，屏幕变成空白。他们运行良好development。

删除所有这些标签对我来说并不实际，<script>因为它们是由我的 CMS (Shopify) 动态插入的。

有什么方法可以让我在生产中捕获这些错误，这样它们就不会关闭我的网站吗？

所以当我尝试通过这段代码向我的元素添加两个类时

var curr_class = document.getElementById(hover_start).className
document.getElementById(hover_start).classList.add("cell-red",curr_class)

我有这个错误

未捕获的 DOMException：无法在“DOMTokenList”上执行“add”：提供的令牌（“1 cell-red”）包含 HTML 空格字符，这些字符在令牌中无效。

我在这里没有看到任何不正确的空白

我需要将名称为test1 的ref 集中起来，设置一些值，该值放置在组件槽中（从外部）。有可能以某种方式做到这一点吗？我尝试从 $refs 或 $slots 获取，但失败了。

应用程序.vue

    <template>
      <div id="app">
        <HelloWorld>
          <input type="text" ref="test1" />
        </HelloWorld>
      </div>
    </template>
    
    ```
    <script>
    import HelloWorld from './components/HelloWorld.vue';
    
    export default {
      name: 'App',
      components: {
        HelloWorld,
      },
    };
    </script>
    
    <style>
    #app {
      font-family: Avenir, Helvetica, Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-align: center;
      color: #2c3e50;
      margin-top: 60px;
    }
    </style>

组件.vue

    <template>
      <slot></slot>
      <hr />
      <input type="text" ref="test2" />
    </template>
    
    <script>
    export default {
      name: 'HelloWorld',
      mounted() {
        this.$refs.test2.value = 'test 2 …

我在 Vue 3 应用程序中使用 Vuetify 3 中的 VSelect，并且尝试使用项目槽。但我的 VSelect 选项变得不可选取

我有这个 VSelect 元素：

 <v-select
    v-model="tag"
    :items="tags"
    variant="solo"
    label="Tags" >
    <template #item="{ item }" >
      <v-list >
        <v-list-item :title="item.title" />
      </v-list>
    </template>
  </v-select>

数据中的标签和标签：

  tag: null,
  tags: [
    { title: 'example1', value: 0 },
    { title: 'example2', value: 1 },
  ],

在输出中我有这个带有选项的选择，但选项不可选择：

那么如何在 Vuetify 3 中为 VSelect 组件设置一个带有可选选项的插槽“item”？

我无法导入 v-data-table 标头的类型定义 DataTableHeader。目前，我是这样写的：

import { DataTableHeader } from 'vuetify/types';

在 TypeScript 错误中，它说

找不到模块“vuetify/types”或其相应的类型声明。

有谁知道这个问题的解决方案？

我正在将旧的 Vue 项目迁移到 Vue3 + Vuetify3 + Vite。我被困在 VDataTable 上，它可以通过Vuetify Labs获得。

我已按照说明在 vuetify.js 中导入 VDataTable 组件：

    import { createVuetify } from 'vuetify'
    import * as components from 'vuetify/components'
    import * as directives from 'vuetify/directives'
    import { VDataTable } from 'vuetify/labs/VDataTable'
    
    const vuetify = createVuetify({
      components : {
        ...components,
        VDataTable,
      },
      directives,
    });
    export default vuetify;

但是当我尝试<v-data-table>在 MyTable 组件中使用时，我在控制台（vite dev 模式）中收到以下错误，并且该表未显示：

SyntaxError：请求的模块“/node_modules/.vite/deps/vuetify_components.js?v=56a024d1”不提供名为“VDataTable”的导出（位于 MyTable.vue?t=1678324759732:1:199）

我使用 Vite 和 Vuetify3Resolver 进行构建。不确定这是否相关 - 上面的语法不是直接导入组件吗？

另外，运行 avite build我收到以下错误：

    import { …

我使用 HTML 标签将 lodash v.4.17.11 js 文件包含在我的 HTML 网页中script。

<body>
...
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.core.min.js"></script> 
</body>

有些功能如_.filter()或_.reduce()工作正常，但_.remove()给了我：

未捕获的类型错误：_.remove 不是函数

库文件里好像不存在这个函数！尽管它已在文档中列出。

我该怎么做才能解决这个问题？谢谢你！

https://lodash.com/docs/4.17.11#remove

我有一个使用 Vuetify 复选框的 Vue JS 应用程序。我无法将初始值设置为选中。

<v-checkbox
  v-else-if="input.type == 'checkbox'"
    false-value="0"
    true-value="1"
    v-model="input.val"
    :error-messages="form.errors[field]"
>

当input.val等于1我期望复选框开始检查。但是，该复选框不会一开始就处于选中状态。

我也尝试过添加道具：

:value="input.val"
:input-value="input.val"

但这些都不会影响复选框的起始状态。如果input.val开始时为1，为什么此框不开始选中？

:value="input.val"
:input-value="input.val"

我正在使用 Vuetify 3 和Maska，它提供输入值的屏蔽。我需要为电话号码设置掩码v-text-field。

该文档描述了它如何与常规 HTML 输入元素配合使用，但我需要将掩码放在 Vuetify 组件上v-text-field。怎么做？

我试过：

  <v-text-field\n    label="\xd0\xa2\xd0\xb5\xd0\xbb\xd0\xb5\xd1\x84\xd0\xbe\xd0\xbd"\n    variant="solo"\n    class="mt-3"\n    clearable\n    v-maska data-maska="+7(###)-###-##-##"\n    v-model="form.phone"\n    :error-messages="v$.form.phone.$errors.map(e => e.$message)"  \n  ></v-text-field>\n

但它不起作用。我已通过以下方式注册了该指令：

directives: { maska: vMaska }\n

我遵循有关如何覆盖 Vuetify SASS 变量的官方指南（链接），其中显示：

\n

在 src/styles 目录中创建 main.scss 文件并更新 vuetify.js 文件中的\n样式导入：

\n

src/样式/main.scss

@use \'vuetify\' with (\n  $app-bar-background: \'red\';\n);\n

src/plugins/vuetify.ts

import \'@/styles/main.scss\'\n

但是，我在应用程序启动时收到此错误消息：

[sass] This variable was not declared with !default in the @used module.\n  \xe2\x95\xb7\n2 \xe2\x94\x82     $app-bar-background: \'red\'\n  \xe2\x94\x82     ^^^^^^^^^^^^^^^^^^^^^^^^^^\n  \xe2\x95\xb5\n  src/styles/main.scss 2:5  root stylesheet\n10:58:31 AM [vite] Internal server error: [sass] This variable was not declared with !default in the @used module.\n  \xe2\x95\xb7\n2 \xe2\x94\x82     $app-bar-background: \'red\'\n  \xe2\x94\x82     ^^^^^^^^^^^^^^^^^^^^^^^^^^\n  \xe2\x95\xb5\n …

我正在将 Summernote-bs5 集成到我的软件中。我从 CDN 中包含它：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.20/summernote-bs5.min.css" integrity="sha512-ngQ4IGzHQ3s/Hh8kMyG4FC74wzitukRMIcTOoKT3EyzFZCILOPF0twiXOQn75eDINUfKBYmzYn2AA8DkAk8veQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
...
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.20/summernote-bs5.min.js" integrity="sha512-6F1RVfnxCprKJmfulcxxym1Dar5FsT/V2jiEUvABiaEiFWoQ8yHvqRM/Slf0qJKiwin6IDQucjXuolCfCKnaJQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

我使用默认值初始化 Summernote 区域。网页：

<div class="mt-2">
    <label class="control-label" for="textarea">Descrizione breve:</label>
    <textarea class="summernote" name="content_abstract"><?=$content->content_abstract?>. 
    </textarea>
</div>

js:

$('.summernote').summernote();

这不起作用。我也尝试使用jsfiddle和 bootstrap 最新版本，但似乎不起作用。jsfiddle