小编Har*_*dia的帖子

我最近尝试运行npm run dev和npm run watch，但在编译 80% 后出现错误。我尝试使用谷歌搜索它，但没有找到解决方案。下面是我在控制台中得到的错误。

./resources/sass/frontend/app.scss 中的错误模块构建失败（来自 ./node_modules/mini-css-extract-plugin/dist/loader.js）：ModuleBuildError：模块构建失败（来自 ./node_modules/css- loader/dist/cjs.js): ValidationError: 无效的选项对象。CSS Loader 已使用与 AP I 架构不匹配的选项对象进行初始化。

• options.url 应该是以下之一：boolean | 对象{过滤器？} -> 允许启用/禁用url()/image-set()功能处理。-> 在https://github.com/webpack-contrib/css-loader#url阅读更多 详情：
  • options.url 应该是一个布尔值。
  • options.url 应该是一个对象： object { filter? 在验证 (E:\Web Projects\project\node_modules\webpack\node_modules\schema-utils\dist\validate.js:105:11) 在 Object.getOptions (E:\Web Projects\project\node_modules\webpack\lib \NormalModule.js:527:19) 在 Object.loader (E:\Web Projects\project\node_modules\css-loader\dist\index.js:31:27) 在 processResult (E:\Web Projects\project\node_modules \webpack\lib\NormalModule.js:701:19) 在 E:\Web Projects\project\node_modules\webpack\lib\NormalModule.js:807:5 在 E:\Web Projects\project\node_modules\loader-runner\ lib\LoaderRunner.js:399:11 在 E:\Web Projects\project\node_modules\loader-runner\lib\LoaderRunner.js:251:18

webpack.mix.js

const mix = require('laravel-mix');

mix.setPublicPath('public')
    .setResourceRoot('../')
    .vue()
    .sass('resources/sass/frontend/app.scss', …

我正在尝试从数据库中获取国家/地区代码，并尝试通过 IP 地址获取默认值。它按照我想要的方式工作了一秒钟，但随后我不知道会发生什么，但它会自行刷新并滚动到第一个选项而不是选定的选项。

Livewire 控制器组件

use App\Models\CountryCodes;
use Livewire\Component;
use Location;

class TestCountry extends Component
{
    public $iso;
    public $country_codes;
    public $country_code;

    public function mount()
    {
        $iso=Location::get('ip');
        $this->iso=$iso->countryCode;
    }

    public function render()
    {
        return view('livewire.test-country',[
            $this->country_codes = CountryCodes::select('nicename','iso','phonecode')->get()->toArray()
        ]);
    }
}

Livewire 刀片组件

<select wire:model.lazy="country_code" name="country_code" id="country_code" class="form-control" required>
    @foreach($country_codes as $country_code)
        <option value="{!! $country_code['iso'] !!}"
                wire:key="{{$country_code['iso']}}"
                {{ $country_code['iso'] == $iso ? 'selected' : ''}}>
            {!! $country_code['iso'] !!} +{!! $country_code['phonecode'] !!}
        </option>
    @endforeach
</select>

此代码确实选择了我的默认选项，但它会自动更改并移动到第一个选项。我在这里做错了什么吗？

最近，我发现在使用 Livewire 验证或执行任何特定任务后，我的 Bootstrap 5 工具提示停止工作。每当 livewire 将数据发送到服务器以验证或更改某些内容时，我的工具提示就像普通的标题标签一样。

验证前：

验证后： [

刀片 HTML：

<abbr data-bs-toggle="tooltip"
      data-bs-placement="left"
      data-bs-html="true"
      title="{!! trans('mmhg_fullform') !!}">
     {!! trans('mmhg') !!}
</abbr>

不太清楚为什么会发生这种情况，我在js中也有一段代码

$('[data-bs-toggle="tooltip"]').tooltip();

我们是否必须在任何地方进行某些更改才能在 Livewire 组件中使用引导工具提示？