如何根据屏幕宽度编辑Rails App中TinyMCE编辑器的宽度

Question

我正在尝试根据屏幕大小在Rails 5应用程序中编辑TinyMCE编辑器的宽度。

我最初尝试使用下面的代码，这有时在您手动刷新页面时有效，但如果您导航到我的网站的另一个页面上有一个TinyMCE编辑器而没有单击刷新按钮，则设置不会生效。

if (screen.width < 700) {
    tinymce.init({
      selector: '.tinymce',  // change this value according to your HTML
      plugins: ['image', 'link', 'codesample', 'preview'],
      toolbar: 'styleselect | bold italic | undo redo | link image | codesample | preview',
      branding: false,
      width: 250,
      height: 250
    });
} else {
    tinymce.init({
      selector: '.tinymce',  // change this value according to your HTML
      plugins: ['image', 'link', 'codesample', 'preview'],
      toolbar: 'styleselect | bold italic | undo redo | link image | codesample | preview',
      branding: false,
      width: 700,
      height: 250
    });
}

我尝试根据关于turbolinks的StackOverflow的一些建议在以下函数中包装上面的代码，但这导致设置根本不生效：

document.addEventListener("turbolinks:load", function() {
})

任何帮助将不胜感激。只是试图找出根据屏幕尺寸编辑TinyMCE宽度的最佳方法（或窗口尺寸也可以）。

注意：我也尝试过这里的解决方案并没有任何运气：How to make TinyMCE Responsive

Answer 1

你有没有尝试过：

tinymce.init({
      selector: '.tinymce',  // change this value according to your HTML
      plugins: ['image', 'link', 'codesample', 'preview'],
      toolbar: 'styleselect | bold italic | undo redo | link image | codesample | preview',
      branding: false,
      width: (screen.width < 700) ? 250 : 700,
      height: 250
    });